Kendo Grid ClientTemplate conditional column

Question

I am working with ASP.NET MVC 4 with Kendo UI(kendo grid).Below is sample code of Kendo Grid -

@(Html.Kendo().Grid(Model.Users).Name("Grid").Columns(columns =>
{
   columns.Bound(p => p.FirstName);
   columns.Bound(p => p.LastName);
   columns.Bound(p => p.UserName);
   columns.Bound(p => p.Email);   
   columns.Bound(o => o.IsActive).ClientTemplate(links).Title("Action");      

})

In the above code my IsActive column have some links for Actions like Edit,Update,Delete.And i am adding those links into Kendo grid by links variable.And I want to use links variable on the basis of conditions.Means i want conditional ClientTemplate here.

So anyone suggest how can make a conditional ClientTemplate in kendoGrid ?

2) Also i want to add condition on the basis on the bool field value of my model(Model.Users).

So i want to know how we can get that field from Model.Users model in kendo grid for each row.Like -

.ClientTemplate(if(IsAdmin && ViewBag.IsActive){.....} else{....})

score 3 · Answer 1 · answered Aug 27 '14 at 11:03

3

You can try like below code..may be this help you..

columns.Bound(p => p.Active).ClientTemplate("\\#if('#=Active#'=='Y') {\\<input type='button' value='OK' />\\}\\#");

or may be use

"#= (Active) ? ' ' : 'your code here' #"

answered Aug 27 '14 at 11:03

Parthiv Pandya

336
2
11

Thanks for reply #Parthiv.But according to my need i have to add one more condition in that template query.And that condition will be based on some other server variable.So can you suggest me how we can add that ? – Pawan Aug 27 '14 at 11:28
Hey Pawan, You are absolutely right but you can maintain this IsAdmin flag in ViewBag and access in this ClientTemplate.or whatever values you can maintaing in viewbag and access it. – Parthiv Pandya Aug 27 '14 at 11:36
@ParthivPandya Parthiv - can you help on this similar issue https://stackoverflow.com/questions/61334924/kendo-grid-clienttemplate-if-else-condition – adityaa Apr 21 '20 at 05:41
.ClientTemplate("# if(data.TotalSalesAmt.sum == 0) " + "{#
Avg: #= kendo.toString(0,'P2') #
#} " + "else {#
Avg: #= kendo.toString(data.TotalMarginAmt.sum / data.TotalSalesAmt.sum,'P2') #
#}#") try this way. – Parthiv Pandya Apr 22 '20 at 15:04

score 1 · Answer 2 · edited Mar 25 '15 at 10:34

1

You can use the following piece of code:

@(Html.Kendo().Grid(Model.Users).Name("Grid").Columns(columns =>
{
  columns.Bound(p => p.FirstName);
  columns.Bound(p => p.LastName);
  columns.Bound(p => p.UserName);
  columns.Bound(p => p.Email);   
  columns.Bound(o => o.IsActive).ClientTemplate("#if(IsActive){#<a href='javascript:void(0)' >Edit</a>#}#").Title("Action");

})

edited Mar 25 '15 at 10:34

Opal

81,889
28
189
210

answered Mar 25 '15 at 10:10

Karthikeyan P

1,216
1
20
23

score -1 · Answer 3 · answered Nov 20 '19 at 20:10

I'm concatenating a name and using a javascript function which made condition testing much easier, plus you can get access to multiple fields:

cshtml:
@(Html.Kendo().Grid<Debtors>()
    .Name("Debtors")
    .Columns(columns =>
    {
        columns.Bound(c => c).Title("Name").ClientTemplate("#=showName(data)#");
        columns.Bound(c => c.Busname);
        ...
     })
    ...
)

js:
function showName(data) {
    var returnName = "";
    if (data.Lname) {
        returnName = data.Lname;
        if (data.Fname) {
            returnName += ", " + data.Fname;
            if (data.Mi) {
                returnName += " " + data.Mi;
            }
        }
    }
    return returnName;
}

Kendo Grid ClientTemplate conditional column

3 Answers3