Please help - beginner

3 posts, 0 answers
  1. Iacob
    Iacob avatar
    2 posts
    Member since:
    Sep 2013

    Posted 08 Dec 2013 Link to this post

    Hi.
    I was struggling those days with a listview.
    Basically, I want to load data remotely.

    Here-s the html code:

         <div data-role="view" data-init="initListView">
            <ul id="listView"></ul>
        </div>
            
          <script type="text/x-kendo-template" id="foo-template">
            #: data #
         </script>

    And here's the javascript code:
     function initListView(e) {
                var dataSourcevar = new kendo.data.DataSource({
                    transport: {
                        read: {
                        // the remote service url
                        url: "http://localhost/PCW/list.php",

                        // JSONP is required for cross-domain AJAX
                        dataType: "jsonp"                    
                }
            }
            });
                
                dataSourcevar.fetch(function() {
                  var products = dataSourcevar.data();
                  console.log(products[0].ProductName);
                });
                
                e.view.element.find("#listView").kendoMobileListView({
                    template : $("#foo-template"),
                    dataSource: dataSourcevar
                });
            }
    I'm loading data from a localhost script made in php. The script displays:
    callback([{"id":"1","name":"Chihuahua","picture":"Chihuahua.jpg"},{"id":"2","name":"chow-chow","picture":"chow-chow.jpg"}])

    However, neither the data it's displayed, neither the javascript log displays something.
    Please help
  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2566 posts

    Posted 09 Dec 2013 Link to this post

    Hi Icaob,

    The problem comes from the fact that you are not setting the template of the ListView correctly. As shown in the demos you need to get the text of the template and pass it to the ListView configuration, while in your case you pass the container. Please check the following example, showing how to configure your ListView - note that in the template you do not use the variable data but the property name that you want to display.

    http://jsbin.com/uZaKUJA/1/edit

    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. Iacob
    Iacob avatar
    2 posts
    Member since:
    Sep 2013

    Posted 09 Dec 2013 Link to this post

    Thanks very much.
    I saw as well, in the initial example that you have to pass the text of template.
    I struggled very much with it.
Back to Top