如果所有验证都是正确的,我如何提交我的表格

How can I submit my form if all the validation is correct?

本文关键字:何提交 提交 表格 我的 验证 如果      更新时间:2024-05-30

我刚刚完成验证工作。当我按下提交时,会出现一个错误框,其中包含与字段相关的错误(例如使用的特殊字符)。当所有字段都正确时,我现在需要提交表格。我该怎么做?当我按下提交按钮时,什么也没发生。

$('button#form-submit').click(function() {
		$.each($("form#all-details input,form#all-details select"),function(a,b){
			if (typeof $(this).attr("data-type") != "undefined") {
				if ($(this).val()=="") {
					dialogWarning('Failure with form submit', '<p>Field <b>"'+$(this).prop("placeholder")+'"</b> must be populated</p>');
					return false;
				};
				if ($(this).attr("data-type")=="text") {
					if (/^[a-z0-9 ]+$/i.test($(this).val())===false) {
						dialogWarning('Failure with form submit', '<p>Please do not use special characters in field <b>"'+$(this).prop("placeholder")+'"</b></p>');
						return false;
					};
				} else if ($(this).attr("data-type")=="number") {
					if ($.isNumeric($(this).val())===false){
						dialogWarning('Failure with form submit', '<p>Field <b>"'+$(this).prop("placeholder")+'"</b> must be a number only</p>');
						return false;
					}
				}
			};
		});
		/* Submit form */
    });
<form id="all-details" onSubmit="return false;" action="add_Consignee.php" method="POST">
	Consignee:</br>
  <input type="text" name="Consignee" id="text" data-type="text" placeholder="Consignee"></br>
	Name:</br>
  <input type="text" name="Name" data-type="text" placeholder="Name" ></br>
  <input type="number" name="Forwarder_Contact_Number" data-type="number" placeholder="Forwarder Contact Number"></br>	
    Any Special Requirements?</br>
  <input type="text" name="Special_Req" data-type="text" placeholder="Any Special Requirements"></br> </br>  
  <button id="form-submit">Submit</button>
</form>

我喜欢这样做:

$('button#form-submit').click(function() {
var _errors = [];
$.each($("form#all-details input,form#all-details select"),function(a,b){
    if (typeof $(this).attr("data-type") != "undefined") {
        if ($(this).val()=="") {
            _errors.push('<p>Field <b>"'+$(this).prop("placeholder")+'"</b> must be populated</p>');
        };
        if ($(this).attr("data-type")=="text") {
            if (/^[a-z0-9 ]+$/i.test($(this).val())===false) {
                _errors.push('<p>Please do not use special characters in field <b>"'+$(this).prop("placeholder")+'"</b></p>');
                _errors++;
            };
        } else if ($(this).attr("data-type")=="number") {
            if ($.isNumeric($(this).val())===false){
                _errors.push('<p>Field <b>"'+$(this).prop("placeholder")+'"</b> must be a number only</p>');
                _errors++;
            }
        }
    };
});
if (_errors.length > 0) {
    dialogWarning('Failure with form submit', _errors.join(' ');
    return false;
} else {
    $(this).submit();
}
/* Submit form */
});

这样,它将同时处理多个错误,并且您将对单击事件有更多的控制权。

如果您的按钮中添加了type="submit",这应该会起作用。

将验证放入函数中,例如

function validate() {
// validation code
 }

然后以您的形式调用它:onSubmit="validate()"