/**
* 把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" />男&nbsp;
     <input type="radio" name="sex" value="1" />女<br/>
爱好:<input type="checkbox" name="hobby[]" value="sing" />唱歌&nbsp;
<input type="checkbox" name="hobby[]" value="code" />写代码&nbsp;
<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表单进行赋值!的更多相关文章

  1. ajax无刷新方式收集表单并提交表单

    ajax无刷新方式收集表单有两种方式, 一个是使用html5的FormData.一个是传统的方式. 一,FormData,在主流的浏览器中可以用,IE不好用啊. 另外,FormData使用有两个条件, ...

  2. jquery下的提交,点击按钮没反应,post方法不执行 JSON方式在FORM表单下不起作用

    jquery下的提交,点击按钮没反应,post方法不执行 JSON方式在FORM表单下不起作用

  3. 防止表单提交时刷新页面-阻止form表单的默认提交行为

    最近在写 ajax 提交的时候遇到一个问题,在执行 ajax 提交之后,浏览器页面自动刷新了,主要是没有 由于form 表单的默认提交行为.一下是几种阻止 form 表单默认提交行为的方式. 1.使用 ...

  4. python中前后端通信方法Ajax和ORM映射(form表单提交)

    后端从数据库获取数据给到前端: 第一种方式: admin.py文件代码: @admin.route('/showList') def show(): # 获取数据库所有文章数据,得到一个个对象 res ...

  5. Django中三种方式写form表单

    除了在html中自己手写form表单外,django还可以通过 继承django.forms.Form 或django.forms.ModelForm两个类来自动生成form表单,下面依次利用三种方式 ...

  6. [Ajax] 使用Ajax异步上传图片文件(非Form表单提交)

    通过表单Form提交来上传文件的方式这里就不说了: 下面介绍,通过js中使用ajax异步上传图片文件: 新建一个html页面和一个一般处理程序即可: 涉及思路: //发送2次Ajax请求完成js异步上 ...

  7. Html Ajax上传文件,form表单下载文件

    Html中的代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type&quo ...

  8. jq form表单自动赋值

    (function ($) { $.fn.extend({ initForm: function (options) { //默认参数 var defaults = { formdata: " ...

  9. 如何通过iframe以post方式提交form表单

    以前用过一次这种技术,这次用居然忘了,现纪录下来,下次再用就来看看. 首先在html中需要准备好form和iframe元素代码如下: <form id="speaker_form&qu ...

随机推荐

  1. 基于key/value+Hadoop HDFS 设计的存储系统的shell命令接口

    对于hadoop HDFS 中的全部命令进行解析(当中操作流程是自己的想法有不允许见欢迎大家指正) 接口名称 功能 操作流程 get 将文件拷贝到本地文件系统 . 假设指定了多个源文件,本地目的端必须 ...

  2. 第1章 Python基础-Python介绍&循环语句 练习题&作业

    1.简述编译型与解释型语言的区别,且分别列出你知道的哪些语言属于编译型,哪些属于解释型? 高级语言分为编译型与解释型两种,分别从执行速度.开发效率.跨平台性三个方面说它们的区别. 编译型语言因为执行的 ...

  3. Python 爬虫编码格式问题 gb2312转换utf8

    遇到的问题是:爬取网页得到的结果如下(部分)  里面的中文出现乱码. <!DOCTYPE html> <html lang='zh-CN'> <head> < ...

  4. C#基础第九天-作业答案-储蓄账户(SavingAccount)和信用账户(CreditAccount)

    class Bank { //Dictionary<long,Account> dictionary=new Dictionary<long,Account>(); DataT ...

  5. Java 在给定路径上创建文件,所在文件夹不存在时,如何正确创建。

    String strPath = "E:\\a\\aa\\aaa.txt"; File file = new File(strPath); if(!file.exists())){ ...

  6. MySql(十七):MySql架构设计——高可用设计之思路及方案

    前言: 数据库系统是一个应用系统的核心部分,要想系统整体可用性得到保证,数据库系统就不能出现任何问题.对于一个企业级的系统来说,数据库系统的可用性尤为重要.数据库系统一旦出现问题无法提供服务,所有系统 ...

  7. 【SSH】Hibernate关联映射

    一对一关联映射 一对一主键关联映射    一句话:不加字段.主键既是主键又是外键. 一对一单向主键关联映射 配置: <span style="font-family:KaiTi_GB2 ...

  8. Android-Cannot merge new index 66195 into a non-jumbo instruction的解决办法

    转载请注明来源:http://blog.csdn.net/goldenfish1919/article/details/33729679 用eclispe打包的时候报错: [2014-06-23 13 ...

  9. 批处理向FTP上传指定属性的文件 批处理增量备份的例子

    使用windows批处理向FTP上传具有指定属性的文件,类似增量备份功能. 对一个目录里的几个文件自动上传FTP时只上传有归档属性的文件,然后FTP上传成功后自动清除(本机)刚上传文件的归档属性. 类 ...

  10. 【Unity】12.4 通过网格分层选择行进路线

    开发环境:Win10.Unity5.3.4.C#.VS2015 创建日期:2016-05-09 一.简介 在具体的游戏情景中,通过分层可以控制物体的行进路线,比如哪些物体只能住水面上行进,哪些物体只能 ...