html disabled 和readonly,disabled 引起的form表单提交问题
2016-08-01 14:49
363 查看
先看看这两个属性在效果和使用上的区别
READONLY and DISABLED both remove the functionality of the input field, but to different degrees. READONLY locks the field: the user cannot change the value. DISABLED does the
same thing but takes it further: the user cannot use the field in any way, not to highlight the text for copying, not to select the checkbox, not to submit the form. In fact, a disabled field is not even sent if the form is submitted.
对于diabled掉的form 表单,
<form id="product_form">
<fieldset id="static_fields" disabled="disabled">
<div class="form-group">
<label class="col-lg-2 control-label" for="product_name">产品名称</label>
<div class="input-group col-lg-6 ">
<input class="form-control static" id="product_name" name="projectName" title="" data-toggle="tooltip" data-placement="bottom" data-original-title="产品名称">
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label" for="capital">募集金额</label>
<div class="input-group col-lg-6 ">
<span class="input-group-addon"><i class="fa">¥</i></span>
<input type="number" min="1" max="100000000" class="form-control static" id="capital" title="" name="capital" data-toggle="tooltip" data-placement="bottom" data-original-title="募集金额">
<span class="input-group-addon"><span>.00</span></span>
</div>
</div>
</fieldset>
</form>
1,我们会发现 input 里的value 在调试时候不能像原来那样查看,必须去prpperties中去查看
2,用js 获取表单内容,会获取到空值,input的值也不会被传到服务器
var form = $('#product_form').serialize();
$.post(url, form, function(data) {
if (data && data.code) {
if (data.code == 0) {
console.log('goto product info page.');
// 刷新页面
alert('修改成功');
} else {
alert(data.message + "[" + data.code + "]");
}
} else {
alert("内部错误");
}
});
调试会发现 form="projectID=&projectName=&capital=" 类似的空值,
所以,我们必须在用js提交表单时候,主动将diabled属性去掉 $('#static_fields').removeAttr("disabled");
READONLY and DISABLED both remove the functionality of the input field, but to different degrees. READONLY locks the field: the user cannot change the value. DISABLED does the
same thing but takes it further: the user cannot use the field in any way, not to highlight the text for copying, not to select the checkbox, not to submit the form. In fact, a disabled field is not even sent if the form is submitted.
对于diabled掉的form 表单,
<form id="product_form">
<fieldset id="static_fields" disabled="disabled">
<div class="form-group">
<label class="col-lg-2 control-label" for="product_name">产品名称</label>
<div class="input-group col-lg-6 ">
<input class="form-control static" id="product_name" name="projectName" title="" data-toggle="tooltip" data-placement="bottom" data-original-title="产品名称">
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label" for="capital">募集金额</label>
<div class="input-group col-lg-6 ">
<span class="input-group-addon"><i class="fa">¥</i></span>
<input type="number" min="1" max="100000000" class="form-control static" id="capital" title="" name="capital" data-toggle="tooltip" data-placement="bottom" data-original-title="募集金额">
<span class="input-group-addon"><span>.00</span></span>
</div>
</div>
</fieldset>
</form>
1,我们会发现 input 里的value 在调试时候不能像原来那样查看,必须去prpperties中去查看
2,用js 获取表单内容,会获取到空值,input的值也不会被传到服务器
var form = $('#product_form').serialize();
$.post(url, form, function(data) {
if (data && data.code) {
if (data.code == 0) {
console.log('goto product info page.');
// 刷新页面
alert('修改成功');
} else {
alert(data.message + "[" + data.code + "]");
}
} else {
alert("内部错误");
}
});
调试会发现 form="projectID=&projectName=&capital=" 类似的空值,
所以,我们必须在用js提交表单时候,主动将diabled属性去掉 $('#static_fields').removeAttr("disabled");
相关文章推荐
- html中form表单向Jsp提交中文乱码问题基本解决办法
- 今天遇到一个问题,原来在html的form中如果只有一个type="text"的控件,如果在text中点击回车键,就是自动提交表单!
- easyUI dialog 缓存问题引起form表单提交文件的错乱
- html表单提交,disabled无法获取数据的问题
- 表单提交中form.action,form.submit()问题
- 解决Form表单重复提交问题
- 摘录:网页form表单重复提交的问题
- html回车键导致form提交的问题
- Chrome Form多次提交表单的问题
- 表单提交中form.action,form.submit()问题
- 关于form表单的submit提交时对象没有该属性和方法问题
- form 表单自动提交问题
- 回车自动提交Form表单的问题
- CKeditor 或其他textarea在提交表单之后,在页面调用时显示html源代码的问题
- 解决multipart/form-data表单中传递参数问题(动态更改表单提交URL)
- 表单提交中form.action,form.submit()问题 *** 对象不支持此属性或方法
- 关于HTML表单中出现双重提交的问题!
- IE下使用form表单提交到iframe中出现的重复提交问题
- Chrome Form多次提交表单问题的解决方法