Question

jquery easyui怎么实现前后台数据的交互

Answer 1

要看你用easyui的哪个组件了，一般官网上都有，我拿一个很简单的例子来说：

使用datagrid

<table class="easyui-datagrid" style="width:400px;height:250px"
       data-options="url:'datagrid_data.json',fitColumns:true,singleSelect:true">
   ……
</table>

这里的data-options里有url的参数，可以换为后台url地址，而后台只要返回一个符合要求的json格式的数据过来就可以了。这里的json格式可以看看官网里的要求格式。

http://www.jeasyui.com/documentation/index.php

还有一种方法是使用js来加载数据：

页面代码比较简单：<table id="dg"></table>
js代码这么写：

$('#dg').datagrid({
   url:'datagrid_data.json',
   columns:[[
       {field:'code',title:'Code',width:100},
       {field:'name',title:'Name',width:100},
       {field:'price',title:'Price',width:100,align:'right'}
   ]]
});

在url里写好后台url的路径就可以了，后台同样是返回一个json给页面。

再者，你想要提交数据给后台？

那么我就说一般情况，就是使用按钮点击提交

可以用form表单提交, action指定后台确定的url，

要么你可以在js中，取得想要传递给后台的数据，写一个$.post或者$.ajax等方法去将数据传递给后台去处理。

这是ajax请求后台的模板：

$.ajax({
    type: 'post',
    url: 'url', // this is the url for backend java program
    data: {'data_post': data_post}, // the data you want to post to backend.
    success: function(result){
        alert('success');
    }
})

Answer 2

easyui内置了ajax来进行交互，哪怕是easyui中的表单form，也是使用ajax

Answer 3

1. EasyUI每一个插件都有一个URL参数

2. 根据EasyUI要求返回指定的Json数据

3. 查看EasyUI官网，查看详细内容。
   

Answer 4

我使用的是Jquery ajax
如下：
$.ajax({
url: '你要处理的後台页面',
type: 'post',
dataType: "json",
data: { '後台方法参数名': ’你的参数值‘ },
success: function (data) {//data为返回的Json结果
if (data.result == "success") {
//你的处理动作;
}
else {
//你的处理动作;
}
},
error: function (xhr, error, ex) {
alert("出现异常");
}
});
希望能帮到你

Answer 5

easyui要实现前后台的数据交互,大体来讲可以按以下顺序来操作

1、了解当前组件数据的所需格式,一般都是json结构

2、后台通过easyui所请求的地址,返回相应的数据(json)

3、获取到数据后，设置要显示的效果。

示例：easyui中的datagrid组件。

格式要求如： 

{total:1000,rows:[{title:122},{title:122},{title:122},{title:122}]}

其中 total 是数据量,rows是当前页的数据

设置datagrid为ajax加载,只需要设置href为请求地址就可以了