转自：https://blog.csdn.net/lenovouser/article/details/52514906
今日(2014-07-23 10:18:01)开始学习EasyUI
1，ajax提交只是简单的异步和文本提交。提交的数据需要序列化或程序指定。同时，数据也需要自己验证。如果使用easyui的验证组件validatebox，则需要在提交前调用，如下：
if ($("#formname").form("validate")){
$.ajax(......)
}
2，easyui的form提交也可以实现无刷新提交，而且可以提交file。但是easyui的form提交是通过ifram实现的，定位在屏幕的 -1000,-1000位置，变相不显示，提交的数据也不需要程序指定和序列化。通过此方式传递的数据是不能被firebug捕捉到的。form提交自动 调用validaebox组件验证提交。
3，ajax可以指定dateType：‘json’，但form提交需要对返回的数据进行JSON转换，调用$.parseJSON().
1,提交与验证:
jQuery EasyUI里表单(Form)的用法和jQuery里AJAX的用法差不多。这些参数的用法：
| 参数名 | 类型 | 描述 | 默认值 |
|---|---|---|---|
| url | 字符串 | 表单提交的地址 | null |
| 事件名 | 参数 | 描述 |
|---|---|---|
| onSubmit | none | 提交之前触发的事件，如果返回false可以防止提交 |
| success | data | 表单提交成功的时候触发 |
| 方法名 | 参数 | 描述 |
|---|---|---|
| submit | options |
执行提交的操作，选项的参数是一个对象，这个对象包括以下的属性： url：设置提交的地址； onSubmit：提交之前的回调函数 submit：提交成功后的回调函数 |
| load | data |
加载记录来填充表单 选项参数可以是一个字符串或者是一个对象，字符串意味着是一个远程地址，否则就是一个本地的数据记录 |
| clear | none | 清空表单数据 |
| validate | none | 表单字段的验证，如果返回true，则说明所有的字段都是合法的。这个方法可以和validatebox插件联合使用 |
只需在OnSubmit事件中使用Return$("#form1").form('validate');即可。该方法会自动对我们指定的required=true的验证字段进行验证，不通过时会返回false:
- $('#fm_line').form('submit', {
- url:'line!saveBgLine.do',
- onSubmit: function(){
- if($("#fm_line").form("validate"))
- return true
- else
- return false;
- },
- //注意ajax的url的后台action方法必须有返回值return "json"，而不是return null,否则下面的回调函数不起作用，sucess方法失效
- success:function(data){
- //此处data={"Success":true}实际为字符串，而不是json对象，需要用如下代码处理
- var obj = jQuery.parseJSON(data);
- if(obj.Success){
- $.messager.alert('消息','保存成功！');
- $('#tab_line').datagrid('reload');
- $("#fm_line").form("clear");
- top.location.href = "main/main.html"; //转主页面
- }else{
- $.messager.alert('消息','保存失败！');
- }
- }
- });
2,使用easyUi
添加 jquery.js,easyui.js
添加本地支持easyui-lang-zh_CN.js
样式表easyui.css和图标icon.css
3，调试对象。
console.info($('#obj')); 不要使用alert
