Accessing ICollections Variable in ClientTemplate

3 posts, 0 answers
  1. S
    S avatar
    2 posts
    Member since:
    Jul 2017

    Posted 11 Jul Link to this post

    Hello-

    I am having an issue accessing my ICollection <Image> Images in the ClientTemplate. It is accessible from the kendo datasource, but not in the ClientTemplate script; however, all of other variables of a different type from my class are accessible. The Image class has a member of type string called "name". My script to access that variable is below. When I load this page, the ListView comes up empty.

     

    <script type="text/x-kendo-tmpl" id="template">
            <div id="product">   
                <dl id="itemDetails">
                    <dt>ImageName:</dt>              
                    <dd>#:Images[0].Name#</dd>            
                </dl>
            </div>
    </script>

     

    How I successfully access the variable from the dataSource:

    function x () {
                var index = this.select().index();
                var dataItem = this.dataSource.view()[index];
                 
                $("#ImageName").html(dataItem.Images[0].name);
    }

     

    How does my syntax need to change to access it in the ClientTemplate script?

    Thank you for the help,

    S

  2. S
    S avatar
    2 posts
    Member since:
    Jul 2017

    Posted 11 Jul in reply to S Link to this post

    A note about my post above, the capitalization of "name" isn't significant to the issue, but rather a typo when I asked the question.
  3. Viktor Tachev
    Admin
    Viktor Tachev avatar
    1768 posts

    Posted 14 Jul Link to this post

    Hi,

    The Kendo DataSource supports flat data. Using complex objects with the components could result in unexpected behavior in some scenarios.

    In order to show the data as expected I can recommend flattening the data before sending it to the client. 

    Furthermore, check out the approach suggested in the article below. Give it a try and let me know how it works for you.



    Regards,
    Viktor Tachev
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top