Template error on undefined item.

6 posts, 0 answers
  1. Lyndsy
    Lyndsy avatar
    1 posts
    Member since:
    Aug 2012

    Posted 23 Jun 2013 Link to this post

    I am having an issue with the template system

    my datasource is volatile by design to allow for maximum flexibility. Everything works great except I have one problem. If an item is undefined it ceases to render any other items if a template is applied. I will use a grid object to explain.

    $("#grid").kendoGrid({
                    dataSource: dataSource,
                    groupable: true,
                    sortable: true,
                    pageable: {                   
                        pageSizes: true
                    },
                    columns: [{
                        field: "FirstName",                   
                        title: "First Name"                   
                    }
                    ,
                    {
                        field: "LastName",                   
                        title: "Last Name"
                    }
                    ,
                    {
                        field: "City"
                    }
                    ,
                    {
                        field: "Title"
                    }
                    ,
                    {
                        field: "BirthDate",
                        title: "Birth Date",
                        template: '#: FormatDate(BirthDate,"dd MMMM yyyy") #'
                    }
                    ,
                    {
                        field: "Age"
                    }
                    ]
                });

    Incoming Data
    [
    {"FirstName":"John","LastName":"Smith","City":"Smalltown","Title":"AR","BirthDate":"1984-07-16T05:00:00Z","Age":28},
    {"FirstName":"John","LastName":"Smith","City":"Smalltown","Title":"AR","BirthDate":"1984-07-16T05:00:00Z"},
    {"FirstName":"John","LastName":"Smith","City":"Smalltown","Title":"AR"}
    ]

    If the template is not set it works as expected non existing members are not shown and everything is hunky dory. But with the template an error gets thrown when it can find BirthDate and stops rendering the grid.
    ReferenceError: BirthDate is not defined
     
    kendo.all.js Line 281 : return new Function(argumentName, functionBody);


    I've tried doing an if statement in the template to return null if the object is undefined but that didn't seem to make a difference.

    Any thoughts on possible workarounds?
  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 25 Jun 2013 Link to this post

    Hello Lyndsy,

     The problems comes from the fact that when you do not have "BirthDate" field in your DataSource, then it is evaluated as "undefined". When using Kendo UI Templates you are allowed to write JavaScript expressions in order to format the data in a proper way. This is why I would suggest you the following template, where you check if you have BirthDate and return an empty string if it is undefined:

    template:  "#= (data.BirthDate) ? kendo.toString(BirthDate, 'dd MMMM yyyy') : '' #"
    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Grant
    Grant avatar
    42 posts
    Member since:
    Jul 2016

    Posted 09 Nov in reply to Kiril Nikolov Link to this post

    Hi Kiril, 

    Is there a way to do this for a boolean value?
    The above template displays blank if my boolean is false or undefined. I'd like it to display 'No' instead.

    Code: 

    template: "#= (data.global) ? global.getYesNo() : '' #"

    *assume that getYesNo() returns a string, 'Yes' or 'No'

    Thanks,
    Grant

  5. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 10 Nov Link to this post

    Hi,

    Please check the following sample and let me know if it helps:

    http://dojo.telerik.com/OLobi

    Regards,
    Kiril Nikolov
    Telerik by Progress
     
    Build rich, delightful, *native* Angular 2 apps with Kendo UI for Angular 2. Try it out today! Kendo UI for Angular 2 (currently in beta) is a jQuery-free toolset, written in TypeScript, designed from the ground up to offer true, native Angular 2 components.
     
  6. Grant
    Grant avatar
    42 posts
    Member since:
    Jul 2016

    Posted 10 Nov in reply to Kiril Nikolov Link to this post

    Hi Kiril,

    Thanks for the response. You example unfortunatly didnt help, but while I was duplicating the error in Dojo, I was able to solve the problem :)

    Heres the sample for interest sake http://dojo.telerik.com/OLobi/2.

    Thanks anyway,
    Grant

  7. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 10 Nov Link to this post

    Hi,

    Thanks for sharing!

    I am glad that the problem is resolved. 

    Regards,
    Kiril Nikolov
    Telerik by Progress
     
    Build rich, delightful, *native* Angular 2 apps with Kendo UI for Angular 2. Try it out today! Kendo UI for Angular 2 (currently in beta) is a jQuery-free toolset, written in TypeScript, designed from the ground up to offer true, native Angular 2 components.
     
Back to Top
Kendo UI is VS 2017 Ready