Javascript jquery验证不起作用的Materializecss
HTML标记Javascript jquery验证不起作用的Materializecss,javascript,jquery,ajax,forms,materialize,Javascript,Jquery,Ajax,Forms,Materialize,HTML标记 <div id="address" class="col s12"> <div class="row"> <form method="post" action="" id="addressDetails"> <div class="input-field col s6"> <textarea id="lAddress" name = 'lAddres
<div id="address" class="col s12">
<div class="row">
<form method="post" action="" id="addressDetails">
<div class="input-field col s6">
<textarea id="lAddress" name = 'lAddress' minlength='20' maxlength='100' class="materialize-textarea" class="validate" required length="100"></textarea>
<label for="lAddress" data-error="Must be between 20 to 100 Characters">Local Address</label>
</div>
<div class="input-field col s6">
<textarea id="pAddress" name = 'pAddress' minlength='20' maxlength='100' class="materialize-textarea" class="validate" required length="100"></textarea>
<label for="pAddress" data-error="Must be between 20 to 100 Characters">Permanent Address</label>
</div>
</form>
</div>
<div class="row center-align">
<button type="submit" name="submitAddress" form="addressDetails" class="waves-effect waves-light light-blue darken-1 btn updateProfile">Save Address Details</button>
</div>
</div>
早期的正常表单提交验证正在工作。但是现在有了jqueryajax请求,我就可以发送数据了,但是当表单无效时,它会以红色显示error,但它会接受有错误的表单
当我使用('sumbit',updateProfile')上的$('button.updateProfile')代码>正在验证,但正在重新加载页面,默认设置不起作用。$(“button.updateProfile”)。在('click',updateProfile')代码>
这不会在materialize validate的帮助下进行验证。您必须查找submit
再次与提交它将有问题,它不是在形式上提交寻找
$(“button.updateProfile”)。在('sumbit',updateProfile')代码>
而不是按钮使用表单,然后将寻找表单提交。像这样
$(“表格”)。在('submit',updateProfile)上代码>
这将非常有效
因此,请记住,无论何时提交表单,都要检查“在表单上提交”而不是“在提交”按钮
function updateProfile(event) {
console.log(this);
event.preventDefault();
form = $(this).closest('.col.s12').find('form');
$.ajax('profile/updateProfile.php', {
type: "POST",
dataType: "json",
data: form.serialize(),
success: function(result) {
Materialize.toast(result.message, 4000);
},
error: function() {
Materialize.toast("Failed: Please contact admin.", 4000);
},
timeout: 5000
});
}
$(document).ready(function() {
$("button.updateProfile").on('click', updateProfile);
});