Form(表单)
使用$.fn.form.defaults重写默认值对象
form提供了各种方法来操作执行表单字段,比如:ajax提交, load, clear等等。当提交表单的时候可以调用validate方法检查表单是否有效。
用法
创建一个简单的HTML表单。构建一个包含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>
<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提交方式的表单。
- $('#ff').form({
- url:...,
- onSubmit: function(){
- // do some check
- // return false to prevent submit;
- },
- success:function(data){
- alert(data)
- }
- });
- // submit the form
- $('#ff').submit();
$('#ff').form({
url:...,
onSubmit: function(){
// do some check
// return false to prevent submit;
},
success:function(data){
alert(data)
}
});
// submit the form
$('#ff').submit();
做一个提交操作。
- // call 'submit' method of form plugin to submit the form
- $('#ff').form('submit', {
- url:...,
- onSubmit: function(){
- // do some check
- // return false to prevent submit;
- },
- success:function(data){
- alert(data)
- }
- });
// call 'submit' method of form plugin to submit the form
$('#ff').form('submit', {
url:...,
onSubmit: function(){
// do some check
// return false to prevent submit;
},
success:function(data){
alert(data)
}
});
提交额外的参数。
- $('#ff').form('submit', {
- url:...,
- onSubmit: function(param){
- param.p1 = 'value1';
- param.p2 = 'value2';
- }
- });
$('#ff').form('submit', {
url:...,
onSubmit: function(param){
param.p1 = 'value1';
param.p2 = 'value2';
}
});
处理提交响应
提交一个ajax表单是非常简单的。用户可以在提交完成后获取响应数据。注意,响应的数据是来自服务器的原始数据。A parse action to the response data is required to get the correct data.
例如,响应数据假设为JSON,一个典型的响应数据格式如下:
- {
- "success": true,
- "message": "Message sent successfully."
- }
{
"success": true,
"message": "Message sent successfully."
}
现在在'success'回调函数中处理JSON字符串。
- $('#ff').form('submit', {
- success: function(data){
- var data = eval('(' + data + ')'); // change the JSON string to javascript object
- if (data.success){
- alert(data.message)
- }
- }
- });
$('#ff').form('submit', {
success: function(data){
var data = eval('(' + data + ')'); // change the JSON string to javascript object
if (data.success){
alert(data.message)
}
}
});
属性
属性名 | 属性值类型 | 描述 | 默认值 |
---|---|---|---|
url | string | 提交表单动作的URL地址 | null |
事件
事件名 | 参数 | 描述 |
---|---|---|
onSubmit | param | 在提交之前触发,返回false可以终止提交。 |
success | data | 在表单提交成功以后触发。 |
onBeforeLoad | param | 在请求加载数据之前触发。返回false可以停止该动作。 |
onLoadSuccess | data | 在表单数据加载完成后触发。 |
onLoadError | none | 在表单数据加载出现错误的时候触发。 |
方法
方法名 | 参数 | 描述 |
---|---|---|
submit | options | 执行提交操作,该选项的参数是一个对象,它包含以下属性: url:请求的URL地址。 onSubmit: 提交之前的回调函数。 success: 提交成功后的回调函数。
下面的例子演示了如何提交一个有效并且避免重复提交的表单。 $.messager.progress(); // 显示进度条 |
load | data | 读取记录填充到表单中。数据参数可以是一个字符串或一个对象类型,如果是字符串则作为远程URL,否则作为本地记录。
代码示例: $('#ff').form('load','get_data.php'); // 读取表单的URL $('#ff').form('load',{ |
clear | none | 清除表单数据。 |
reset | none | 重置表单数据。(该方法自1.3.2版开始可用) |
validate | none | 做表单字段验证,当所有字段都有效的时候返回true。该方法使用validatebox(验证框)插件。 |
Form(表单)的更多相关文章
- form表单验证-Javascript
Form表单验证: js基础考试内容,form表单验证,正则表达式,blur事件,自动获取数组,以及css布局样式,动态清除等.完整代码如下: <!DOCTYPE html PUBLIC &qu ...
- Form 表单提交参数
今天因为要额外提交参数数组性的参数给form传到后台而苦恼了半天,结果发现,只需要在form表单对应的字段html空间中定义name = 后台参数名 的属性就ok了. 后台本来是只有模型参数的,但是后 ...
- form表单 ----在路上(15)
form 表单就是将用户的信息提交到服务器,服务器会将信息存储活着根据信息查询数据进行增删改查,再将其返回给用户. 基本格式: <form action="" method ...
- form表单的字符串进行utf-8编码
<form>表单有assept-charset属性.该属性规定字符的编码方式,默认是"unknown",与文档的字符集相同. 该属性除了Internet explore ...
- 细说 Form (表单)
细说 Form (表单) Form(表单)对于每个WEB开发人员来说,应该是再熟悉不过的东西了,可它却是页面与WEB服务器交互过程中最重要的信息来源. 虽然Asp.net WebForms框架为了帮助 ...
- 通过form表单的形式下载文件。
在项目中遇到问题,要求动态拼接uri下载文件.但是由于项目的安全拦截导致window.location.href 和 window.open等新建窗口的方法都不行. 无意间百度到了通过form表单来下 ...
- form 表单跨域提交
<!DOCTYPE html><html> <head> <title>form 表单上传文件</title> <script src ...
- form表单的属性标签
form表单的常用标签 表单: <form id="" name="" method="post/get" action=" ...
- form表单的属性标签和练习
form表单的标签 做一个如下图的form表单: 我们的代码如下: <body leftmargin="400px" topmargin="200px"& ...
- Django基础,Day5 - form表单投票详解
投票URL polls/urls.py: # ex: /polls/5/vote/ url(r'^(?P<question_id>[0-9]+)/vote/$', views.vote, ...
随机推荐
- 开发板挂载nfs服务器错误解析
输入mount -t nfs 192.168.1.110:/home/work /mnt,这时可能会出现 mount.nfs:access denied by server while mountin ...
- mysql 行列动态转换(列联表,交叉表)
mysql 行列动态转换(列联表,交叉表) (1)动态,适用于列不确定情况 create table table_name( id int primary key, col1 char(2), col ...
- poj 1845 Sumdiv (数论)
题目链接 题意:求 A^B的所有约数之和对9901取模后的结果. 分析: 看了小优的博客写的. 分析来自 http://blog.csdn.net/lyy289065406/article/detai ...
- Catalan数推导(转载)
Raney引理: 设整数序列A = {Ai, i=1, 2, …, N},且部分和Sk=A1+…+Ak,序列中所有的数字的和SN=1,在A的N个循环表示中,有且仅有一个序列B,满足B的任意部分和Si均 ...
- hdu4576 概率dp n^2的矩阵
这个题目看网上好多题解都是直接O(n*m)卡过.我是这么做的. 对于m次操作,统计每个w的次数.然后对每个w做矩阵乘法. 这样直接做矩阵乘法是会TLE的. 又由于这里的矩阵很特殊,一次乘法可以降维成O ...
- UVa 10003 (可用四边形不等式优化) Cutting Sticks
题意: 有一个长为L的木棍,木棍中间有n个切点.每次切割的费用为当前木棍的长度.求切割木棍的最小费用. 分析: d(i, j)表示切割第i个切点到第j个切点这段所需的最小费用.则有d(i, j) = ...
- android webview js alert对话框 不能弹出 解决办法
在配置了webview的 setting属性后,以前设置的都是可以直接弹出来的,今天写一个小demo时候莫名其妙的发现alert怎么也出来,即使设置了这么多也不行: webSettings.setJa ...
- android通过httpClient请求获取JSON数据并且解析
使用.net创建一个ashx文件,并response.write json格式 public void ProcessRequest(HttpContext context) { context.R ...
- UVALive 4128 Steam Roller(最短路(拆点,多状态))
题意:模拟了汽车的行驶过程,边上的权值为全速通过所消耗的时间,而起步(从起点出发的边).刹车(到终点结束的边).减速(即将拐弯的边).加速(刚完成拐弯的边)这四种不能达到全速的情况,消耗的时间为权值* ...
- django - get_or_create() 使用提醒
[omron - debug] user_id建表的时候,不能使用unique,因为一个用户,可能有多个product_id,相对应的是,get_or_create()中的查询参数,如果在建表中有un ...