Kendo UI Grid - 链接上的显示网格点击

我正在使用KendoUI Web，并且希望单击Kendo ListView时显示Kendo Grid的链接。我为ListView使用了一个模板。Kendo UI Grid - 链接上的显示网格点击

HTML：

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

模板：

<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>

我试图做到这一点使用下面的代码，但没有任何反应。只有id被正确读取，但请求没有被创建。

$(" .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"}, 
       ] 
    }); 

}});

来源

2012-09-13 Anna

你想让Grid代替ListView，还是要在Kendo窗口中打开？ – John

我想要ListView旁边的网格。像主细节一样。 – Anna

我建议你使用AJAX来请求一个服务器方法，该方法返回JSON并将其绑定到$（“＃grid”）。data（“kendoGrid”）._数据返回 – John

我解决了这个问题，通过删除函数之外的网格的创建。因此，首先显示网格没有数据。

var ds=new kendo.data.DataSource({ 
      transport: { 
       read: "somefile.php", 
      }, 
     schema: { 
       data:"data", 
       model: { 
        id: "id_pf", 
        fields:{ 
           first:{}, 
           second:{} 
          } 
       } 
     }, 
     total: function(response) { 
      return $(response.data).length; 
     }, 

     pageSize: 10 
}); 

$("#grid").kendoGrid({ 
    dataSource: ds, 

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

在链接点击，数据源重新读取更新的网址，刷新，现在显示所需的数据。

$(" .list").live({click:function(){ 

var id=$(this).attr('id'); 

    var gridUrl = "somefile.php?id="+ id; 

     var grid = $("#grid").data("kendoGrid"); 

     grid.dataSource.transport.options.read.url =gridUrl; 
     grid.dataSource.read(); 
     grid.dataSource.refresh(); 

    }});

来源

2012-09-14 17:13:28 Anna

Kendo UI Grid - 链接上的显示网格点击

回答

相关问题