使用动态输入参数绑定Kendo Grid数据源(RestURL)

时间:2014-12-15 14:30:20

标签: kendo-grid

我有一个输入文本框,一个按钮和一个剑道网格。 kendo网格的数据源是Rest webservice url。 My Rest Web服务需要一个输入参数,在此基础上它发送适当的json数据。我的要求是每当我点击按钮时它从输入框中获取数据,将其作为输入参数附加到Rest URL,从Web服务获取并显示相应的数据。如果我更改输入文本框中的值并再次单击按钮,则应使用Web服务返回的新数据集刷新kendo网格。以下是我的代码。 HTML:

   <div ng-app="myApp">

   <div ng-controller="myCtrl">

   <div>

    <form>

       Enter Param

      <div>

         <input type="text" ng-model="param">

      </div>

    <button type="submit" ng-click="submitParam()">Submit</button>                            

</form>

</div> 

    <div id="grid" kendo-grid k-options="kendoGrid"></div>

</div>

</div>

控制器:

var myApp = angular.module('myApp',[]);
myApp.controller('myCtrl', function ($scope, myService) {
    $scope.param = "";
    $scope.kendoGrid = myService.getKGrid();
    $scope.submitParam = function(){
    **//here param should be appended in the Rest URL and kendo grid data should change as per the** new URL.
    }
});

服务:

myApp.service('myService', function () {
this.getKGrid = function () {                
var kGrid = {
       dataSource: {
       transport: {
         read: {
           url: MyRestURL/param,**//Here the param will be appended**
           dataType: "json"
          }
        },
        },
      columns: [{
                field: "Col1",
                title: "Col1"
            },
            {
                field: "Col2",
                title: "Col2"
            }                                
          ]
        };
       return kGrid;
    };
});

1 个答案:

答案 0 :(得分:0)

我可以通过使用Grid数据源的grid.dataSource.transport.options.read.url属性动态更改数据源URL来解决此问题。 参考链接:Kendo UI Dynamically Change Datasource String (XML)