2016-03-18 36 views
1

我有一个从远程服务器(Json)获取数据并将数据绑定到客户端的kendo模板的Kendo数据源。Kendo UI远程数据源修改

在客户端上,现在我只显示数据。但是,我想要在dataSource中添加/删除数据。如何在修改后将dataSource发送回服务器并将其存储在那里?

这是我正在尝试做的一个很好的例子。虽然本示例从本地变量中读取其数据,但请您告诉我:

如何在客户端修改用户后在服务器端存储数据源?

http://jsfiddle.net/derickbailey/D4g8S/

例如add方法只是更新在客户端的数据源。但是,我想将它发送到服务器,并将其存储在那里。作为结果,如果其他人在另一个客户端中打开相同的网页,他/她也可以看到更改。

$("#add").click(function(e){ 
    e.preventDefault(); 

    var $todo = $("input[name='description']"); 

    currentId += 1; 
    dataSource.add({ 
    id: currentId, 
    done: false, 
    description: $todo.val() 
    }); 

    $todo.val(""); 
    $todo.focus(); 
}); 

我在服务器端使用C#.Net MVC。

回答

1

据我所知,你问的是如何根据客户端的变化做出服务器更改?如果是真的,你可以做三件事情:

你修改
  • 捕捞数据(添加,删除,更新),
  • 序列化到JSON,
  • 发送到控制器的动作。

下面是简单的例子,你怎么会看您的数据源的数据:您分配这些数据的一些对象,你可以序列化到JSON与后

var dataSource = new kendo.data.DataSource({ 
    data: [ 
    { id: 1, name: "Jane Doe", age: 30 }, 
    { id: 2, name: "John Doe", age: 33 } 
    ] 
}); 

dataSource.fetch(function(){ 
    // reading data from dataSource 
    var raw = dataSource.data(); 
    // entire dataSource 
    alert("This is entire dataSource: " + JSON.stringify(raw)); 
    // this is what will be removed 
    alert("This is removed: " + JSON.stringify(raw[0]));  
    dataSource.remove(raw[0]);   
    // this is what is rest 
    alert("This is rest: " + JSON.stringify(raw)); 
}); 

:JSON.stringify(数据)的方法。

比你可以发布这些数据控制器的行动,并做一些工作。如何将JSON发布到MVC控制器是常见问题,请阅读here

删除和更新是相似的。基本上你必须捕捉你想要的数据,序列化并发布到行动。

1

您可以在数据源上使用add方法,并指定在哪里发布新数据。 KendoUI文档中有一个example。从那里你也可以配置编辑/删除方法。

1

从数据源对象使用JSON获得阵列toJSON方法

dataSource.data().toJSON() 

,那么你可以将它张贴到服务器

Demo