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)  }  }
});

属性

Name	Type	Description	Default
url	string	form的action的URL提交地址	null

事件

Name	Parameters	Description
onSubmit	none	form提交之前触发,该方法返回false将阻止submit动作.
success	data	当form提交成功之后触发.
onBeforeLoad	param	在请求加载数据之前触发.该方法返回false将取消这个动作.
onLoadSuccess	data	当form数据成功加载之后触发.
onLoadError	none	当在加载数据的时候出现一些异常的时候触发.

方法

Name	Parameter	Description
submit	options	执行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'); // 当成功提交之后隐藏进度条} });
load	data	加载记录填充form. 这个 data 参数可以是一个string或者是一个object类型, 当是string类型的时候将请求远程服务器端数据,其他(例如:object类型)行为定义为加载本地记录. 示例代码: $('#ff').form('load','get_data.php'); // 从URL加载 $('#ff').form('load',{//加载本地记录name:'name2',email:'mymail@gmail.com',subject:'subject2',message:'message2',language:5 });
clear	none	清空form数据
validate	none	做form字段验证,返回true表示所有字段合法,这个方法使用了validatebox插件plugin.

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

easyUI form相关推荐

easyui form提交和formdata提交记录，查看FormData对象内部的值
1 easyui form提交 $('form').form('submit',{url:'';onSubmit:'';success:function(data){//这种方法获取到的data是字 ...
EasyUI Form提交后json数据IE上需要下载（转）
EasyUI Form提交后json数据IE上需要下载(转) 在使用EasyUI的form中的submit方法时,返回json在IE中变成提示下载的问题,代码如下: $('#fileForm').fo ...
关于ie中easyui form组件load事件无法多次加载数据
1.废话不多说,既然找到这了就是要解决问题的: 在easyui中form load事件是这样用的的 load data 加载记录来填充表单. data 参数可以是一个字符串或者对象类型,字符串作为一个 ...
easyui form 提交
<form id="myForm" method="post"> <table align="center" style= ...
easyui form 返回html,form（表单） - TopJUI前端框架，不用写JS代码的EasyUI
Form(表单) 使用$.fn.iForm.defaults重写默认值对象 form提供了各种方法来操作执行表单字段,比如:ajax提交, load, clear等等.当提交表单的时候可以调用vali ...
easyui from 缓存问题处理
1 这是ie低版本,缓存了easyui form load事件获取的服务器端数据,给ajax时间加上清除缓存就ok. 找到easyui 中的form load事件添加cache:false, /* ...
jquery easyui二次开发总结（二）
1.easyui tab增加"关闭所有页"."关闭非当前页"功能. 1 //tab增加"关闭所有页"和"关闭非当前页"的 ...
jquery表单ajax json数据,jquery序列化form表单使用ajax提交后处理返回的json数据
1.返回json字符串: /** 将一个字符串输出到浏览器 */ protected void writeJson(String json) { PrintWriter pw = null; try ...
easyUI 1.3 中文 API
@author YHC CSDN讨论组:https://code.csdn.net/groups/16406 期待你的加入. 以下是easyUI1.3版本的中文API 以下如果有写错误的地方或者是用词 ...

easyUI form

使用

处理 submit 响应

属性

事件

方法

easyUI form相关推荐

最新文章

热门文章