如何在jquery easy ui CRUD DataGrid中绑定Web服务

时间:2013-03-18 05:05:15

标签: c# jquery asp.net web-services jquery-easyui

我正在使用jQuery EasyUI CRUD datagrid在c#asp.net中开发一个网站。 但我需要用我的Web服务替换.php文件来绑定数据网格,如下面的代码片段所示。请建议我这样做。

 <table id="dg" title="My Users" style="width:700px;height:250px"  
            toolbar="#toolbar" pagination="true" idField="id"  
            rownumbers="true" fitColumns="true" singleSelect="true">  
        <thead>  
            <tr>  
                <th field="firstname" width="50" editor="{type:'validatebox',options:{required:true}}">First Name</th>  
                <th field="lastname" width="50" editor="{type:'validatebox',options:{required:true}}">Last Name</th>  
                <th field="phone" width="50" editor="text">Phone</th>  
                <th field="email" width="50" editor="{type:'validatebox',options:{validType:'email'}}">Email</th>  
            </tr>  
        </thead>  
    </table>  

<script type="text/javascript">  
        $(function(){  
            $('#dg').edatagrid({  
                url: 'get_users.php',  
                saveUrl: 'save_user.php',  
                updateUrl: 'update_user.php',  
                destroyUrl: 'destroy_user.php'  
            });  
        });  
    </script>  

1 个答案:

答案 0 :(得分:1)

您可以使用jQuery Ajax和jTemplate。

$.ajax({
    url: "Your webservice path",
    type: "POST",
    data: "JSON formated data to pass in the webservice",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    cache: false,
    success: function (data) {
       //You can further use jTemplate to output the data.
    },
    error: function (data) {
    }
});

以下链接显示了jTemplate的一个简单示例: http://www.codeproject.com/Articles/45759/jQuery-jTemplates-Grid