Grid ClientsideTemplate multiple conditions (if else if...)

[Romel]

Hi, can someone show me the proper syntax for multiple if else-if, else statement inside the ClientsideTemplate of the Kendo Grid?

This is a snippet from where my code is breaking (I think....)

columns.Bound(d => d.FileExtension).ClientsideTemplate(
   
"# if (FileExtension == true) { #" +
"<img src='pdf.png' alt='' />" +
"# } else if (FileExtension == '.docx') { #" +
"<img src='word.png' alt='' />" +
"# } else { #" +
"<div> </div>" +
"# } #"
)

The code breaks and getting errors on kendo.all.min.js file. So, I'm not even really sure if my syntax is correct to begin with... =) Thanks very much and I look forward to the response.


Romel

[Nikolay Rusev]

Hello Romel,

The client template seems correct. Here is a quick example on how to validate the correctness of the expressions: http://trykendoui.telerik.com/@rusev/ePUT - in the console all three branches of the condition expression are executed.

The error shouldn't be due to this template. Can you isolate the behavior in a runnable example so that we can debug it locally?

Regards,
Nikolay Rusev
Telerik

 

 

[Romel]

hi Nikolay,

Thanks for the reply. After reading some more posts on the forum I managed to come up with something that eventually worked for me. Here's my code, hoping that it would help someone out in the long run.

columns.Bound(d => d.DocumentFileExtType).ClientTemplate("#=GetFileExtType(DocumentFileExtType) #").Width(25).Title("").HtmlAttributes(new { style = "text-align: center" });

********THIS IS THE JAVASCRIPT FUNCTION I WROTE ON THE PAGE***********

function GetFileExtType(value) {

        if (value == ".pdf" || value == ".PDF" || value == ".Pdf") {
            return "<img src='../Images/docadded4.png' alt='' /> ";
        }
        else if (value == ".doc" || value == ".docx" || value == ".DOC" || value == ".DOCX") {
            return "<img src='../Images/word.png' alt='' /> ";
        }
        else if (value == ".xls" || value == ".xlsx" || value == ".XLS" || value == ".XLSX") {
            return "<img src='../Images/excel.png' alt='' /> ";
        }
        else if (value == ".ppt" || value == ".pptx" || value == ".PPT" || value == ".PPTX") {
            return "<img src='../Images/powerpoint.png' alt='' /> ";
        }
        else if (value == ".msg" || value == ".MSG") {
            return "<img src='../Images/outlook.png' alt='' /> ";
        }
        else if (value == ".txt") {
            return "<img src='../Images/textfile.png' alt='' /> ";
        }
        else if (value == ".jpg" || value == ".JPG" || value == ".jpeg" || value == ".JPEG" || value == ".png" || value == ".PNG" || value == ".tif" || value == ".TIF" || value == ".tiff" || value == ".TIFF" || value == ".bmp" || value == ".BMP" || value == ".gif" || value == ".GIF") {
            return "<img src='../Images/photo.png' alt='' /> ";
        }
    }