ajax表单提交

时间:2021-08-22 05:39:05

HTML代码:

<form id="formCity" action="/SiteMap/Search" method="get" onsubmit="return false">
<div class="form-group">
<div style="padding: 0; line-height: 30px; float: left; font-size: 16px; ">
快速查找:
</div>
<div class="col-md-3">
<input id="city_search" name="search" class="form-control" data-provide="typeahead" type="text" value="" required />
</div>
</div>
<input class="btn btn_main_sm" value="搜索" type="submit" onclick="findCity('formCity')">
</form>

Js代码:

<script type="text/javascript" src="/Resource/Scripts/jquery.validate.js"></script>
<script type="text/javascript" src="/Resource/Scripts/jquery.validate.Extend.js"></script>
<script type="text/javascript">
function findCity(formId) {
var form = $("#" + formId);
var valid = form.valid();
var method = form.attr("method");
var action = form.attr("action");
var btnSubmit = form.find("[type=submit]");
var btnText = btnSubmit.val();
if (valid) {
$.ajax({
type: method,
url: action,
beforeSend: function () {
btnSubmit.addClass('disabled').text("正在查询...");
},
data: form.serialize(),
success: function (data) {
if (data.IsSuccess) {
location.href = data.Message;
}
else {
alert(data.Message);
}
btnSubmit.removeClass("disabled").text(btnText);
}
, error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("NetworkError:" + XMLHttpRequest.status + " " + XMLHttpRequest.statusText)
btnSubmit.removeClass("disabled").text(btnText);
}
})
} }