This is a migrated thread and some comments may be shown as answers.

How I can use column template from client side to show anchor tag with my another column value

4 Answers 537 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Hasibul
Top achievements
Rank 1
Hasibul asked on 20 Mar 2013, 08:57 AM
I am new on Kendo UI.
I am using Kendo Grid from Client Side. I am also bound data from Client side.
Consider following code which i have used to bind json data.
var people = [
             { firstName: "Hasibul", lastName: "Haque", email: "hasibul@yahoo.com" }
       ];
 
       $('#grid').kendoGrid({
           scrollable: true,
           sortable: true,
           pageable: true,
           selectable: "row",
           filterable: true
 
         , dataSource: { data: people, pageSize: 10 }
         , columns:
             [
               { field: "firstName", title: "First Name" }
             , { field: "lastName", title: "Last Name" }
             , { field: "email", title: "email" }
             , {
                 field: "action", title: "Action",
                 template: "I want to put action linke here by using field value(firstName)"
               }
             ]
            
 
       });

I just want to show another column called action column. From where user can do perform another action. In my action link i want to show First name. How i can do that?
I can populate action column from server side but now i want to do everything from client side.
If i consider server side
column.Template(c => @Html.ActionLink(c.Description, "foo", new { id = c.prop, })
I want something similar on client side.

Hope you will help me. 

4 Answers, 1 is accepted

Sort by
0
Dimiter Madjarov
Telerik team
answered on 20 Mar 2013, 10:26 AM
Hello Hasibul,


To specify an action column with a link, you could use the following syntax.
E.g.
{
   title: "Action",
   template: "<a href='/foo?firstName=#=firstName#'>#=firstName#</a>"
}

Additional information about Kendo Templates can be found in the Demos and in the Documentation.

 

Kind regards,
Dimiter Madjarov
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Hasibul
Top achievements
Rank 1
answered on 20 Mar 2013, 10:53 AM
Thanks for making replay.
How i can get specific row data.
Here i am putting 
<a href='/foo?firstName=#=firstName#'>#=firstName#</a>

but it shows #=firstName# on display. How i can assign value ?
Hope you people will help me...

0
Accepted
Dimiter Madjarov
Telerik team
answered on 20 Mar 2013, 12:02 PM
Hello Hasibul,

With #=firstName# I am referencing the value of the firstName property of the current item. Take a look at the following JS Bin Example which demonstrates this. Please let me know if this was the information, that you were looking for.
 

All the best,
Dimiter Madjarov
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Hasibul
Top achievements
Rank 1
answered on 20 Mar 2013, 03:53 PM
Thanks a lot Dimiter Madjarov. Its working.
Tags
Grid
Asked by
Hasibul
Top achievements
Rank 1
Answers by
Dimiter Madjarov
Telerik team
Hasibul
Top achievements
Rank 1
Share this question
or