This is a migrated thread and some comments may be shown as answers.

Populate list view

0 Answers 83 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Smiely asked on 13 Aug 2012, 02:14 PM
Hi, I am new to Kendo UI. I want to populate a listview from JSON object. My JSON obj has image and image name. I want to display image and it's name under that. Where should I start ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
    <script src="../lib/script/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="../lib/script/jquery-1.7.2.js" type=""></script>
    <!-- Kendo UI Web styles -->
    <link href="../styles/kendo.common.min.css" rel="stylesheet" />
    <link href="../styles/kendo.default.min.css" rel="stylesheet" />    
    <link href="../styles/kendo.blueopal.min.css" rel="stylesheet" />    
    <!-- Kendo UI Web scripts -->
    <script src="../js/jquery.min.js" type=""></script>
    <script src="../js/kendo.web.min.js" type=""></script>        
        <div id="example" class="k-content">
        <div id="listView"></div>
        <div id="pager" class="k-pager-wrap">
            <script type="text/x-kendo-tmpl" id="template">
                <div class="product">
                        <img src="../../${image}.png" alt="" />
           <script type="">
                $(document).ready(function () 
                    var dataSource = new{
                    transport: {
                            read: {
                                url: "images_json.txt",
                                dataType: "json"
                        schema: {
                            data: "results"
              dataSource: dataSource
               dataSource: dataSource,
                template: kendo.template($("#template").html())
                <style type="">
                        float: left;
                        width: 270px; 
                        height: 110px;
                        margin: 10px;
                        padding: 5px;                        

Appreciate your help.

No answers yet. Maybe you can help?

Asked by
Top achievements
Rank 1
Share this question