我正在使用formData提交表单的数据,因为我的from中有一些文件。有一次,当我提交表单时,只需在成功提交表单后跳过成功。 它发生一次,我试图使用Html 5 ajax验证我的表格。 但是,当我尝试使用自定义验证时,它的工作正常。
Js代码是: -
function propertyDetails() {
$('#submitPropertyDetails').click(function () {
if (window.FormData !== undefined) {
if (isValidPropertyDetails() && getPropertyFormData() != null) {
showLoading();
$.ajax({
url: '/Member/PropertyDetails',
type: "POST",
contentType: false,
processData: false,
data: getPropertyFormData(),
success: function (result) {
setAmentiesDetails(result);
hideLoading($('#propertyDetails')[0]);
},
error: function (jqXhr) {
alert(jqXhr.statusText);
$errors = jqXhr.responseJSON;
hideLoading($('#propertyDetails')[0]);
}
});
}
}
else {
alert("FormData is not supported.");
}
});
};
function getPropertyFormData() {
// Create FormData object
var form = $('#propertyDetails')[0];
var officeTypeDetails = new FormData(form);
return officeTypeDetails;
};
var isValidPropertyDetails = function () {
if ($('#propertyDetails')[0].checkValidity()) {
return true;
}
else
return false;
};
我的Html代码是: -
<form method="post" id="propertyDetails">
<div class="col-md-8 slid-spaceDetailsMiddleColumn">
<div class="form-group">
<div class="col-md-12">
<div class="col-md-3">
<label class="textColor">Looking for</label>
</div>
<div class="col-md-3">
<div class="col-md-7">
<input class="form-control" data-val="true" data-val-number="The field PropertySubTypeId must be a number." id="PropertySubTypeId" name="PropertySubTypeId" required="" type="radio" value="2">
</div>
<div class="col-md-5">
<label class="textColor">Dental</label>
</div>
</div>
<div class="col-md-3">
<div class="col-md-7">
<input class="form-control" id="PropertySubTypeId" name="PropertySubTypeId" required="" type="radio" value="1">
</div>
<div class="col-md-5">
<label class="textColor">Medical</label>
</div>
</div>
<div class="col-md-3">
<div class="col-md-7">
<input class="form-control" id="PropertySubTypeId" name="PropertySubTypeId" required="" type="radio" value="3">
</div>
<div class="col-md-5">
<label class="textColor">Genral</label>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-4">
<br>
<input class="form-control" data-val="true" data-val-number="The field RentableSquareFeet must be a number." id="RentableSquareFeet" name="RentableSquareFeet" placeholder="Rentable Square Feet" required="" type="text" value="">
<br>
</div>
<div class="col-md-4">
<br>
<input class="form-control" data-val="true" data-val-number="The field UsableSquareFeet must be a number." id="UsableSquareFeet" name="UsableSquareFeet" placeholder="Usable Square Feet" required="" type="text" value="">
<br>
</div>
<div class="col-md-4">
<br>
<input class="form-control" data-val="true" data-val-date="The field AvilableDate must be a date." id="AvilableDate" name="AvilableDate" placeholder="Avilable Date" required="" type="text" value="">
<br>
</div>
</div>
<div class="col-lg-10">
<div class="form-group">
<div class="col-md-offset-12">
<button class="btn btn-info" id="submitPropertyDetails" type="submit" value="Submit">
Continue
</button>
</div>
</div>
</div>
</div>
<div class="col-md-4 slid-sideMediaSmallColumn">
<br>
<video width="100%" height="160px" controls="" autoplay="autoplay">
<source src="/UploadVideo/hubToBidVideo.png" type="video/mp4">
</video>
<div class="form-group">
<div class="col-md-12">
<input type="file" id="Video" name="Video" class="form-control">
</div>
</div>
</div>
</form>