Kendo UI - conditional column in kendo ui base based on column values
I am having trouble using kendo grid columns template, my scenario is like this:
My column will generate action links based on another example of column values:
columns.Bound(a => a.ref_nb).Width(145).Template(@<text></text>).ClientTemplate("#= (tran_ty =='SO') ? '<a>" + "${data.ref_nb}" + "</a>' : '<span>No Entry</span>'#");
this script uses ternary to base what will be encoded in the column based on the other values of the tran_ty columns, but it throws an error in the template that is called by the page. is there any possible way i can achieve this? Any help would be greatly appreciated. TIA
source to share
Try this for ClientTemplate()
#= if(tran_ty == 'SO') { # <a href='#=ref_db#'>#=ref_db#</a> # } else { # <span>No Entry</span> # } #
Note. You may need to adjust the quotes a bit, but that should get you on the right track.
See more syntax here: http://docs.telerik.com/kendo-ui/framework/templates/overview#template-syntax
source to share
Personally, I find this process easier when trying to make more complex customer templates.
Change the linked column to:
columns.Bound(a => a.ref_nb).Width(145).ClientTemplate("#=myClientSideTemplate(data)#");
Then you have javascript that does the formatting for you:
function myClientSideTemplate(data) {
var returnString = '';
if(data.tran_ty === 'SO')
{
returnString = '<a href="' + data.ref_nb + '">' + data.ref_nb + '</a>';
}
else
{
returnString = '<span>Value is not equal to SO</span>';
}
return returnString;
}
This way you can keep playing with javascript and not have a problem where you might be missing a quote or piece of information.
This also means that if you need this function elsewhere, you can reuse the code.
source to share