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

Create and display a grid when a link is clicked

1 Answer 33 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Anica
Top achievements
Rank 1
Anica asked on 13 Sep 2012, 03:59 PM
I want to  display a grid  when a link inside a ListView is clicked . I'm using a template for the ListView.

Html:
<div id="listView" ></div>

<div id="grid" ></div>

Template:

<script type="text/x-kendo-tmplate" id="template">
    <div>
             <ul>
                     <li><a class="list k-link" title="#= title #" id="#= id#" >#= name #</a></li>
                </ul>
    </div>
</script>

I tried to do this using following code but nothing happens. Only id is read correctly but the request is not made.

$(" .list").live({click:function(){
 
    var id=$(this).attr('id');

    $("#grid").kendoGrid({
           dataSource: {
                 transport: {
                        read: "somefile.php?id="+id,  
                 },
               schema: {
                         data:"data",
                          model: {
                               id: "id_pf",
                               fields:{
                                    first:{}, 
                                   second:{}
                               }
                        }
              },
             total: function(response) {
                      return $(response.data).length;
             },

            pageSize: 10
         },

         columns: [
                 { title: "First", field: "first"},
                { title: "Second", field: "second"},
            ]
       });

}});

1 Answer, 1 is accepted

Sort by
0
Vladimir Iliev
Telerik team
answered on 14 Sep 2012, 02:51 PM
Hi Anica,


I have reviewed your code and it seems that the issue comes from the invalid property "data" in schema definition:

schema: {
    data:"data",

Also please note that you should initialize the Grid only once -  for example at document ready function. After that on "click" event  you should only refresh the DataSource with different Id.

e.g.:
$(".list").live({ click: function() {
              $("#grid").data("kendoGrid").dataSource.read({ id: value })


Kind Regards,
Vladimir Iliev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
Anica
Top achievements
Rank 1
Answers by
Vladimir Iliev
Telerik team
Share this question
or