easyUI form

@author YHC

覆盖默认值 $.fn.form.defaults.

form提供不同的方法执行操作表单字段例如ajax submit,loader,clear,等等..当提交表单的时候,'validate'将调用验证表单是否合法.

使用

创建简单的HTML form,构造这个通常会使用id,action和method的值;

<form id="ff" method="post">      <div>          <label for="name">Name:</label>          <input class="easyui-validatebox" type="text" name="name" data-options="required:true" />      </div>      <div>          <label for="email">Email:</label>          <input class="easyui-validatebox" type="text" name="email" data-options="validType:'email'" />      </div>      ...  </form>  

使表单成为ajax提交的form

$('#ff').form({      url:...,      onSubmit: function(){          // 做一些验证          // 返回false 将阻止提交;      },      success:function(data){          alert(data)      }  });  // 提交表单$('#ff').submit();  

执行提交动作

// 执行form插件的 'submit'方法来提交form$('#ff').form('submit', {      url:...,      onSubmit: function(){          // 做一些验证..          // return false ;返回false将阻止提交动作 ;      },      success:function(data){          alert(data)      }  });  

处理 submit 响应

提交一个ajax的form非常简单,当提交结束后用户可以得到响应数据,注意这个响应数据是来自服务器端的原始数据,响应数据的一个解析动作是需要得到的是正确的数据.

例如:响应数据假设为json,一个标准的响应数据例如下面这个:

{      "success": true,      "message": "Message sent successfully."  } 

现在处理json字符串在'success'回调函数中:

$('#ff').form('submit', {      success: function(data){          var data = eval('(' + data + ')');  // 改变json对象为javascript对象        if (data.success){              alert(data.message)          }      }  });  

属性

NameTypeDescriptionDefaulturlstringform的action的URL提交地址null

事件

NameParametersDescriptiononSubmitnoneform提交之前触发,该方法返回false将阻止submit动作.successdata当form提交成功之后触发.onBeforeLoadparam在请求加载数据之前触发.该方法返回false将取消这个动作.onLoadSuccessdata当form数据成功加载之后触发.onLoadErrornone当在加载数据的时候出现一些异常的时候触发.

方法

NameParameterDescriptionsubmitoptions执行submit动作, 这个 options参数是一个对象包含一下属性:
url: 这个提交动作的URL地址
onSubmit: 在提交之前的回调函数
success: 提交成功之后的回调函数
下面的示例展示如何提交一个合法form和避免重复提交form

$.messager.progress();// 显示一个进度条 $('#ff').form('submit', {url: ...,onSubmit: function(){var isValid = $(this).form('validate');if (!isValid){$.messager.progress('close');// 当form不合法的时候隐藏工具条}return isValid;// 返回false将停止form提交 },success: function(){$.messager.progress('close');// 当成功提交之后隐藏进度条}});

loaddata加载记录填充form. 这个 data 参数可以是一个string或者是一个object类型, 当是string类型的时候将请求远程服务器端数据,其他(例如:object类型)行为定义为加载本地记录.

示例代码:

$('#ff').form('load','get_data.php');// 从URL加载 

$('#ff').form('load',{//加载本地记录name:'name2',email:'[e-mail]',subject:'subject2',message:'message2',language:5});

clearnone清空form数据 validatenone做form字段验证,返回true表示所有字段合法,这个方法使用了validatebox插件plugin.



以上如果有错误信息,请指出 thanks!