我在同一个cshtml
页面中有多个具有相同字段名称的表单。我想在特定表单的提交按钮上将特定表单的数据发布到控制器。如何实现呢?
我已经创建了jquery方法,如下所示,
var valSettings = {
rules: {
CompanyName: {
required: true,
},
ContactPerson: {
required: true,
},
ContactNo: {
required: true,
},
EmailID: {
required: true,
email: true
},
Querytype: {
required: function (element) {
if ($("input[name='Querytype'] option:selected").text() == "Kindly select") {
return false;
}
else {
return true;
}
}
}
},
messages: {
CompanyName: "Company Name field should not be blank.",
ContactPerson: "Contact Person field should not be blank.",
ContactNo: "Contact No field should not be blank.",
EmailID: {
required: "Contact No field should not be blank.",
email: "Please specify a valid email address"
},
Querytype: "Query Type field should not be blank.",
},
submitHandler: function () {
var data = new FormData($(this).get(0));
$.ajax({
url: "@Url.Action("SaveContactDetails", "StaticPage")",
type: 'POST',
data: data,
contentType: false,
processData: false,
success: function (data) {
if (data == 1) {
bootbox.alert("Contact details saved succesfully!!");
$(this)[0].reset();
//var validator = $('#frmContactIndia').validate();
//validator.resetForm();
}
else {
bootbox.alert("Error in saving contact details! Please try again later!");
}
}
});
}
}
$('#frmContactIndia').validate(valSettings);
$('#frmContactBelgium').validate(valSettings);
我的控制器动作方法,
public int SaveContactDetails(ContactUsModel _objContactUsModel)
{
return 1;
}
我在提交第一张表格时获得_objContactUsModel
的价值。但是当我提交其他表格时,我会在_objContactUsModel
中为每个字段获取空值。
Html视图,
<form role="form" id="frmContactIndia" method="post">
<div id="india" class="ofc-cont graytexturebg pageblock blockcontainer" data-scroll-index="1">
<div class="container">
<div class="innerheading">India Office</div>
<div class="ofcinfo">
<div class="left-addr">
<div class="jbbroshkttl">India - Mumbai</div>
<div class="addr">
J.B. And Brothers Pvt. Ltd.<br />
Tower FC-3011/12, 3rd Floor, Bharat Diamond Bourse,<br />
BKC, Bandra(East), Mumbai-400051
</div>
<div class="tel">Tel : +91 22 40342222 <span>|</span> Fax : +91 22 40342299</div>
<div class="tel">Mktg : +91 9833812803/4/5/6 <span>|</span> +91 9769223739</div>
<div class="email">Email : info@jbbrothers.com</div>
<div class="email">Skype : jbmarketingteam</div>
</div>
<div class="right-addr">
<div class="jbbroshkttl">India - Surat</div>
<div class="addr">
J.B. And Brothers Pvt. Ltd.<br />
Patel Wadi-3, Near Shivanjali Row House, Near Natraj Cinema,<br />
Laldarwaja, Surat-395 004.
</div>
<div class="tel">Tel : +91 261 260 7777 <span>|</span> Fax : +91 261 260 7888</div>
<div class="email">Email : info@jbbrothers.com</div>
<div class="email">Skype : jbmarketingteam</div>
</div>
</div>
<div class="assicont">
<div class="assi-heading">
<div class="jbbroshkttl">For more assistance</div>
</div>
<div class="assi-form">
<div class="assirow">
<input type="hidden" name="ContactType" value="India - Mumbai" />
<div class="assiformflidwrap">
<input type="text" name="CompanyName" placeholder="Company name" class="assiformfildblk" />
<span>*</span>
</div>
<div class="assiformflidwrap">
<input type="text" name="ContactPerson" placeholder="Contact Person" class="assiformfildblk" />
<span>*</span>
</div>
<div class="assiformflidwrap">
<input type="text" name="ContactNo" placeholder="Contact No." class="assiformfildblk" />
<span>*</span>
</div>
</div>
<div class="assirow">
<div class="assiformflidwrap">
<input type="text" name="EmailID" placeholder="Email ID" class="assiformfildblk" />
<span>*</span>
</div>
<div class="assiformflidwrap">
<select name="Querytype" class="assiformselectflidblk">
<option>Kindly select</option>
<option>Website</option>
<option>Sales query</option>
<option>Technical Assistant</option>
<option>Export / Shipment</option>
<option>Accounting</option>
<option>Senior management</option>
<option>Director</option>
<option>Human Resource</option>
<option>Other</option>
</select>
<span>*</span>
</div>
</div>
<div class="assirow">
<div class="assiformflidwrap assitextareawrap">
<textarea name="queryDetail" placeholder="Query" class="assiformtextareablk"></textarea>
<span>*</span>
</div>
</div>
<div class="assirow">
<div class="ibvm">
<input type="submit" id="btnSubmit" value="submit now" class="green-btn uppercase" />
</div>
<div class="ibvm">
<input type="reset" value="Reset" class="gray-btn uppercase" />
</div>
</div>
</div>
</div>
</div>
</div>
</form>
<form role="form" id="frmContactBelgium" method="post">
<div id="belgium" class="bluetexturebg ofc-cont pageblock blockcontainer" data-scroll-index="2">
<div class="container">
<div class="innerheading whitecolor">Belgium - Antwerpen</div>
<div class="addrdetails">
<div class="addr">
Yaelstar BVBA<br />
30 Hoveniersstraat, Box 154, Suite # 807, 8th Floor,<br />
B - 2018, Antwerp, Belgium.
</div>
</div>
<div class="addrdetails">
<div class="tel">Tel : +32 3231 0022 <span>|</span> Fax : +32 3231 5623</div>
<div class="tel">Mktg : +32 477 678020</div>
</div>
<div class="addrdetails">
<div class="email">Email : yaelstar@telenet.be</div>
<div class="email">Skype : riikesh</div>
</div>
<div class="assicont">
<div class="assi-heading">
<div class="jbbroshkttl">For more assistance</div>
</div>
<div class="assi-form">
<div class="assirow">
<input type="hidden" name="ContactType" value="Belgium - Antwerpen" />
<div class="assiformflidwrap">
<input type="text" name="CompanyName" placeholder="Company name" class="assiformfildblk" />
<span>*</span>
</div>
<div class="assiformflidwrap">
<input type="text" name="ContactPerson" placeholder="Contact Person" class="assiformfildblk" />
<span>*</span>
</div>
<div class="assiformflidwrap">
<input type="text" name="ContactNo" placeholder="Contact No." class="assiformfildblk" />
<span>*</span>
</div>
</div>
<div class="assirow">
<div class="assiformflidwrap">
<input type="text" name="EmailID" placeholder="Email ID" class="assiformfildblk" />
<span>*</span>
</div>
<div class="assiformflidwrap">
<select name="Querytype" class="assiformselectflidblk">
<option>Kindly select</option>
<option>Website</option>
<option>Sales query</option>
<option>Technical Assistant</option>
<option>Export / Shipment</option>
<option>Accounting</option>
<option>Senior management</option>
<option>Director</option>
<option>Human Resource</option>
<option>Other</option>
</select>
<span>*</span>
</div>
</div>
<div class="assirow">
<div class="assiformflidwrap assitextareawrap">
<textarea name="queryDetail" placeholder="Query" class="assiformtextareablk"></textarea>
<span>*</span>
</div>
</div>
<div class="assirow">
<div class="ibvm">
<input type="submit" id="btnSubmit" value="submit now" class="green-btn uppercase" />
</div>
<div class="ibvm">
<input type="reset" value="Reset" class="gray-btn uppercase" />
</div>
</div>
</div>
</div>
</div>
</div>
</form>
答案 0 :(得分:0)
this
未引用submitHandler
中的表单元素。要获取当前form
,您可以使用form
参数。
submitHandler: function (form) {
var data = new FormData(form);
$.ajax({
url: "@Url.Action("SaveContactDetails", "StaticPage")",
type: 'POST',
data: data,
contentType: false,
processData: false,
success: function (data) {
if (data == 1) {
bootbox.alert("Contact details saved succesfully!!");
form.reset(); // you need to change this as well
}
else {
bootbox.alert("Error in saving contact details! Please try again later!");
}
}
});
}
If you use HTML Helpers
to create your form,那么您无需手动处理所有这些验证。您只需将Required
等验证属性添加到属性中即可。