我正在尝试使用 PHP 和 AJAX 制作简单的登录系统。我的问题是,当我尝试提交注册表单时,它的验证有效并且数据保存到数据库中,但表单没有动态重置。当我检查控制台时,有一些错误。请帮我解决这个问题。
<form id="signupForm" role="form" method="post" action="add-user-submit.php" enctype="multipart/form-data">
<div class="form-group">
<input type="text" name="username" id="username" class="form-control" placeholder="username" tabindex="1" >
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="text" name="firstname" id="firstname" class="form-control" placeholder="First Name" tabindex="2" >
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="text" name="lastname" id="lastname" class="form-control" placeholder="Last Name" tabindex="3" >
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="text" name="index_no" id="index_no" class="form-control" placeholder="C00007" data-charset="_XXXXX" tabindex="4" >
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<select id="designation" name="designation" class="form-control m-bot15" >
<option>Select Designation</option>
<option value="O">Officer (O)</option>
<option value="OC">Officer Cash(OC)</option>
<option value="SO">Senior Officer(SO)</option>
<option value="SOC">Senior Officer Cash(SOC)</option>
<option value="PO">Principal Officer(PO)</option>
<option value="SPO">Senior Principal Oficer(SPO)</option>
<option value="AGM">Assistant General Manager(AGM)</option>
<option value="DGM">Deputy General Manager(DGM)</option>
<option value="GM">General Manager (GM)</option>
<option value="CITO">Chief Information Technology Officer(CITO)</option>
</select>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="tel" name="phone" id="phone" class="form-control" placeholder="Phone Number" tabindex="5" >
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="email" name="email" id="email" class="form-control" placeholder="Email Address" tabindex="5" >
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="password" name="password" id="password" class="form-control" placeholder="Password" tabindex="5" >
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="password" name="confirm_password" id="confirm_password" class="form-control" placeholder="Confirm Password" tabindex="6" >
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<select id="level_access" name="level_access" class="form-control m-bot15" >
<option>Select Role</option>
<option value="1">Admin</option>
<option value="2">Manager</option>
<option value="3">User</option>
</select>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<select id="active" name="active" class="form-control m-bot15" >
<option value="1">Active</option>
<option value="2">inactive</option>
</select>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-12"><input type="submit" value="Add" class="btn btn-primary btn-block " tabindex="7"></div>
</div>
</form>
function register() {
hideshow('loading', 1);
error(0);
$.ajax({
type: "POST",
url: "add-user-submit.php",
data: $('#signupForm').serialize(),
dataType: "json",
success: function(msg) {
if (parseInt(msg.status) == 1) {
$("#signupForm").reset();
//show the success message
$('.done').fadeIn('slow');
console.log(msg)
} else if (parseInt(msg.status) == 0) {
error(1, msg.txt);
}
hideshow('loading', 0);
}
});
}
Uncaught TypeError: $(...).reset is not a function
at Object.success (common-scripts.js:41)
at l (jquery-1.8.3.min.js:2)
at Object.fireWith [as resolveWith ] (jquery-1.8.3.min.js:2)
在 T (jquery-1.8.3.min.js:2)
在 XMLHttpRequest.r (jquery-1.8.3.min.js:2)
使用时 $("#signupForm").trigger('reset');
Uncaught TypeError: s[y] is not a function
at Object.trigger (jquery-1.8.3.min.js:2)
at HTMLFormElement.<anonymous> (jquery-1.8.3.min.js:2)
at Function.each (jquery-1.8.3.min.js:2)
at init.each (jquery-1.8.3.min.js:2)
at init.trigger (jquery-1.8.3.min.js:2)
at Object.success (common-scripts.js:41)
at l (jquery-1.8.3.min.js:2)
at Object.fireWith [as resolveWith] (jquery-1.8.3.min.js:2)
at T (jquery-1.8.3.min.js:2)
at XMLHttpRequest.r (jquery-1.8.3.min.js:2)
使用时 $("#signupForm")[0].reset();
Uncaught TypeError: $(...)[0].reset is not a function
at Object.success (common-scripts.js:41)
at l (jquery-1.8.3.min.js:2)
at Object.fireWith [as resolveWith] (jquery-1.8.3.min.js:2)
at T (jquery-1.8.3.min.js:2)
at XMLHttpRequest.r (jquery-1.8.3.min.js:2)
reset()
是本机 Element 对象的函数,而不是 jQuery 对象。因此,您需要在调用之前从 jQuery 对象中检索该元素reset()
,如下所示:
$("#signupForm")[0].reset();
// or
$("#signupForm").get(0).reset();
或者,为了避免必须从 jQuery 对象中检索元素,您可以触发自身的reset
事件form
:
$("#signupForm").trigger('reset');
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句