提交成功后,请清除jasyui表单字段
Clear jeasyui form fields after successful submit
我正在使用一个jeasyui表单,在xoops模块内,一旦数据成功提交,我就试图清除所有表单字段。
我已经参考了这个问题,但它并没有解决我的问题。我的HTML:
<div class="easyui-panel" title="Capture Reqs" style "width:100%;
max-width:600px; padding:30px 60px;">
<form action = "captureReqs_Save.php" id ="ff" class = "easyui-form"
method ="post" data-options = "novalidate:true">
<div style="margin-bottom:20px"> Area <br>
<input id="idArea" class="easyui-combobox" style="width:260px" name="idArea"
data-options="
url:'areasJson.php?idZona=<?php echo $idZone; ?>',
label:'Area:',
valueField: 'id',
textField: 'desc',
required:true
">
</div>
<div style="margin-bottom:20px"> Material
<input id="IdMaterial" class="easyui-combobox" style="width:100%"
name="IdMaterial" data-options="
loader: myloader,
mode: 'remote',
valueField: 'code',
textField: 'desc',
required:true
">
<div style="margin-bottom:20px"> Qty
<input class="easyui-textbox" name="quantity" style="width:100%"
data-options="label:'Qty:',required:true, validType:'number'">
</div>
<div style="margin-bottom:20px">
</form>
<div style="text-align:center;padding:5px 0">
<a href="javascript:void(0)" class="easyui-linkbutton"
onClick = "submitForm()" style="width:80px"> Submit</a>
<a href="javascript:void(0)" class="easyui-linkbutton"
onClick = "resetForm()" style = "width:80px"> Clear </a>
</div>
</div>
脚本:
<script>
var myloader = function (param, success, error) {
var q = param.q || '';
if (q.length <= 2) {
return false
}
$.ajax({
url: 'materialJson.php?idArea=' + $('#idArea').combobox('getValue'),
dataType: 'json',
data: {
q: q
},
success: function (data) {
var items = $.map(data, function (item, index) {
return {
code: item.code,
desc: item.desc
};
});
success(items);
},
error: function () {
error.apply(this, arguments);
}
});
}
function submitForm() {
$('#ff').form('submit', {
onSubmit: function () {
return $(this).form('enableValidation').form('validate');
}
});
}
function resetForm() {
$('#ff')[0].reset();
}
</script>
尝试调用resetForm。我转换为使用承诺风格的ajax,并添加了resetForm
var myloader = function (param, success, error) {
var q = param.q || '';
if (q.length <= 2) {
return false
}
$.ajax({
url: 'materialJson.php?idArea=' + $('#idArea').combobox('getValue'),
dataType: 'json',
data: {
q: q
}
}).then(function (data) {
var items = $.map(data, function (item, index) {
return {
code: item.code,
desc: item.desc
};
});
success(items);
}).fail(function () {
error.apply(this, arguments);
});
}
function submitForm() {
$('#ff').submit(function () {
if ($(this).form('enableValidation').form('validate')) {
$.post($(this).attr('action'), $(this).serialize(), function (response) {
clearForm();
});
}
return false;
});
}
function resetForm() {
$('#ff')[0].reset();
}
相关文章:
- 可以't让我的if语句处理js中的html表单输入
- 如何使用WCF服务和javascript表单post上传.doc文件
- Javascript生成的表单未提交
- 如何使用javascript或html下载PDF格式的填写表单
- HTML表单提交时未执行外部函数
- 如何将输入(type=text)从html表单传递到javascript函数
- 通过单击表单中的按钮,在代码生成中使用javascript生成字母数字代码
- Ajax发布表单序列化,发布引号'
- 多级HTML表单
- 后焦点更改为IE 11中的地址栏,而不是转移到表单中的下一个控件
- 在验证和发送邮件后更改联系人表单的 html
- jQuery表单添加不适用于下拉列表
- Rails/JSON:如何将JSON用于jquery UI自动完成表单
- 如何从pdftron webviewer获取表单数据
- JS验证ajax返回的html中的表单数据
- Javascript更新孙窗口中的表单元素
- 解析javascript表单验证器
- 阻止表单元素提交
- JS表单提交"无法使用Chrome数据保护程序加载此页面.尝试重新加载页面.调试信息:POST CISmtuK
- Jquery提交表单而不刷新