html jquery from 表单提交 $(form).ajaxSubmit application/x-www-form-urlencoded 改成 json
要使用 jQuery 根据 name
属性找出被选中的 checkbox 的值,你可以使用以下的方法:
- 遍历所有的 checkboxes 并检查哪个是被选中的。
- 使用 jQuery 的
.val()
方法来获取被选中的 checkbox 的值。
<form class="form form-horizontal" id="form-admin-add"> <div class="row cl"> <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>管理员:</label> <div class="formControls col-xs-8 col-sm-9"> <input type="text" class="input-text" value="" placeholder="" id="adminName" name="adminName"> </div> <div class="row cl"> <label class="form-label col-xs-4 col-sm-3">角色:</label> <div class="formControls col-xs-8 col-sm-9"> <div class="check-box"> <input type="checkbox" id="chkAnalysis" name="doctorRole" value="Analysis"> <label for="chkAnalysis">报告医生</label> </div> <div class="check-box"> <input type="checkbox" id="chkAudit" name="doctorRole" value="Audit"> <label for="chkAudit">审核医生</label> </div> <div class="check-box"> <input type="checkbox" id="chkReview" name="doctorRole" value="Review"> <label for="chkReview">高级审核</label> </div> </div> </div> <div class="row cl"> <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3"> <input class="btn btn-primary radius" type="submit" value=" 提交 "> <input type="hidden" id="hidId" value="" /> </div> </div> </div> </form>
application/x-www-form-urlencoded js
<script type="text/javascript"> $(function(){ $('.skin-minimal input').iCheck({ checkboxClass: 'icheckbox-blue', radioClass: 'iradio-blue', increaseArea: '20%' }); $("#form-admin-add").validate({ rules:{ adminName:{ required:true, minlength:4, maxlength:16 }, password:{ required:true, }, password2:{ required:true, equalTo: "#password" }, sex:{ required:true, }, phone:{ required:true, isPhone:true, }, email:{ required:true, email:true, }, adminRole:{ required:true, }, }, onkeyup:false, focusCleanup:true, success:"valid", submitHandler:function(form){ $(form).ajaxSubmit({ type: 'post', url: "xxxxxxx" , success: function(data){ layer.msg('添加成功!',{icon:1,time:1000}); var index = parent.layer.getFrameIndex(window.name); parent.$('.btn-refresh').click(); parent.layer.close(index); }, error: function(XmlHttpRequest, textStatus, errorThrown){ layer.msg('error!',{icon:1,time:1000}); } }); } }); }); </script>
POST 改成 JSON
submitHandler:function(form){} 的代码修改如下:
submitHandler:function(form){ var userRoleList = new Array(); $('input[type="checkbox"][name="doctorRole"]').each(function(){ if(this.checked){ var userRole = {} userRole.roleCode = $(this).value(); userRoleList.push(userRole); } }); var obj = {}; obj.id = $("#hidId").val().trim(); obj.adminName = $("#adminName").val().trim(); obj.roleList = userRoleList; //$(form).ajaxSubmit({ //这个要换掉,不然不起作用 $.ajax({ type: 'post', url: "xxxxxxx" , dataType: 'json', contentType: "application/json;charset=utf-8", headers: { 'AccessToken': 'TokenValue' }, data: JSON.stringify(obj), // 将 JSON 对象转换为 JSON 字符串作为请求数据 beforeSend: function (XMLHttpRequest) { layer.msg("数据提交中....", { icon: 16, time: 60000, shade: 0.1 }); }, success: function(data){ layer.msg('添加成功!',{icon:1,time:1000}); var index = parent.layer.getFrameIndex(window.name); parent.$('.btn-refresh').click(); parent.layer.close(index); }, error: function(XmlHttpRequest, textStatus, errorThrown){ layer.msg('error!',{icon:1,time:1000}); } }); }