ajax无刷新方式对form表单进行赋值!
/**
* 把json数据填充到from表单中
*/
<form id="editForm" action="user.php">
用户名:<input type="text" name="usrname" /><br/>
地址:<input type="text" name="address" /><br/>
性别:<input type="radio" name="sex" value="0" />男
<input type="radio" name="sex" value="1" />女<br/>
爱好:<input type="checkbox" name="hobby[]" value="sing" />唱歌
<input type="checkbox" name="hobby[]" value="code" />写代码
<input type="checkbox" name="hobby[]" value="trance" />发呆
</form>
以下是JS方法用于对form表单进行赋值(通用方法)
$.fn.formEdit = function(data){
return this.each(function(){
var input, name;
if(data == null){this.reset(); return; }
for(var i = 0; i < this.length; i++){
input = this.elements[i];
//checkbox的name可能是name[]数组形式
name = (input.type == "checkbox")? input.name.replace(/(.+)\[\]$/, "$1") : input.name;
if(data[name] == undefined) continue;
switch(input.type){
case "checkbox":
if(data[name] == ""){
input.checked = false;
}else{
//数组查找元素
if(data[name].indexOf(input.value) > -1){
input.checked = true;
}else{
input.checked = false;
}
}
break;
case "radio":
if(data[name] == ""){
input.checked = false;
}else if(input.value == data[name]){
input.checked = true;
}
break;
case "button": break;
default: input.value = data[name];
}
}
});
};
调用方式:
$json = { "usrname":"张三", "address":"湖北钟祥", "sex": "1", "hobby":["sing", "trance"]};
$('#editForm').formEdit($json);
调用代码解释说明:
$(form表单).formEdit(json数据);
json数据说明:基本格式{inputname: value}, 具体类型{"text":"aaa", "checkbox":[1,2,3], "radio":"10"}
ajax无刷新方式对form表单进行赋值!的更多相关文章
- ajax无刷新方式收集表单并提交表单
ajax无刷新方式收集表单有两种方式, 一个是使用html5的FormData.一个是传统的方式. 一,FormData,在主流的浏览器中可以用,IE不好用啊. 另外,FormData使用有两个条件, ...
- jquery下的提交,点击按钮没反应,post方法不执行 JSON方式在FORM表单下不起作用
jquery下的提交,点击按钮没反应,post方法不执行 JSON方式在FORM表单下不起作用
- 防止表单提交时刷新页面-阻止form表单的默认提交行为
最近在写 ajax 提交的时候遇到一个问题,在执行 ajax 提交之后,浏览器页面自动刷新了,主要是没有 由于form 表单的默认提交行为.一下是几种阻止 form 表单默认提交行为的方式. 1.使用 ...
- python中前后端通信方法Ajax和ORM映射(form表单提交)
后端从数据库获取数据给到前端: 第一种方式: admin.py文件代码: @admin.route('/showList') def show(): # 获取数据库所有文章数据,得到一个个对象 res ...
- Django中三种方式写form表单
除了在html中自己手写form表单外,django还可以通过 继承django.forms.Form 或django.forms.ModelForm两个类来自动生成form表单,下面依次利用三种方式 ...
- [Ajax] 使用Ajax异步上传图片文件(非Form表单提交)
通过表单Form提交来上传文件的方式这里就不说了: 下面介绍,通过js中使用ajax异步上传图片文件: 新建一个html页面和一个一般处理程序即可: 涉及思路: //发送2次Ajax请求完成js异步上 ...
- Html Ajax上传文件,form表单下载文件
Html中的代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type&quo ...
- jq form表单自动赋值
(function ($) { $.fn.extend({ initForm: function (options) { //默认参数 var defaults = { formdata: " ...
- 如何通过iframe以post方式提交form表单
以前用过一次这种技术,这次用居然忘了,现纪录下来,下次再用就来看看. 首先在html中需要准备好form和iframe元素代码如下: <form id="speaker_form&qu ...
随机推荐
- [AaronYang原创] 敏捷开发-Jira 6.0.5环境搭建[2]
基本配置-关卡一(我研究了1.5个小时 AaronYang) JIRA的设置向导将只显示您安装后第一次JIRA. 一旦你完成了它,你不能再次运行它. 然而,每一个设置在设置向导配置可以通过管理控制 ...
- HDOJ 1281 棋盘游戏
拆点二分图匹配 棋盘游戏 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Tot ...
- List遍历Java 8 Streams map() examples
1. A List of Strings to Uppercase 1.1 Simple Java example to convert a list of Strings to upper case ...
- 解决Myeclipse中导入自定义的配色方案后,JSP中的js代码块为白色背景的问题
捣鼓了大半个上午,终于搞定.这样设置就可以了: 点击MyEclipse上方的菜单栏中的window菜单.选择Preferences菜单项.在弹出的窗口的左侧树形菜单依次选择:MyEclipse.Fil ...
- Spring Security教程(六):自定义过滤器进行认证处理
这里接着上篇的自定义过滤器,这里主要的是配置自定义认证处理的过滤器,并加入到FilterChain的过程. 在我们自己不在xml做特殊的配置情况下,security默认的做认证处理的过滤器为Usern ...
- 呃,如何使 .NET 程序,在 64位 系统 中,以 32位 模式运行。
其实最简单的方法就是在解决方案中,把平台设为 x86 就好了哈~ 但是今天遇到一个第三方的软件,它调用的一个 dll 是 32位 的,可能它没有测试过在 64位 系统下运行的情况,它在编译时是按默 ...
- 香蕉派 banana pi BPI-M3 八核开源硬件开发板
Banana PI BPI-M3 是一款8核高性能单板计算机,Banana PI BPI-M3是一款比树莓派 2 B更强悍的8核Android 5.1产品. Banana PI BPI-M3 兼 ...
- octave画心形曲线
octave是gnu出品和matlab兼容的科学计算软件,具有体积小,兼容性好,免费的优点. 心形曲线是根据函数:( x2 + y2 -1 )3 - x2y3=0 改编而成. clear all; c ...
- jquery 获取URL参数并转码的例子
通过jquery 获取URL参数并进行转码,个人觉得不错,因为有时不转码就会有乱码的问题.jquery 获取URL参数并转码,首先构造一个含有目标参数的正则表达式对象,匹配目标参数并返回参数值代码: ...
- mui做的苹果app生成ipa后放到自己的网站上让人下载安装
苹果的APP不通过app store的话就只能是要那个$299的企业签名证书了.这个我还不会搞,没有搞过!!! 别人已经帮忙签名好的ipa,自己再传到自己的服务器上让人下载安装,步骤如下: Hbuid ...