我在 MVC 应用程序中使用 jQuery 在模式对话框中有一个联系我们表单。该框弹出得很好,但是当我单击对话框中的提交按钮时,它没有进入我的操作方法。我尝试了一些方法,但无法弄清楚出了什么问题。有人能看到我可能做错了什么吗?谢谢。
PartialView(联系我们表格):
@model BackgroundSoundBiz.Models.EmailModel
<form id="sendEmailForm">
<div id="sendForm">
@Html.LabelFor(m => m.senderName)<br />
@Html.TextBoxFor(m => m.senderName)
<br />
@Html.LabelFor(m => m.senderEmail)<br />
@Html.TextBoxFor(m => m.senderEmail)
<br />
@Html.LabelFor(m => m.message)<br />
@Html.TextAreaFor(m => m.message)
<br />
<input class="close" name="submit" type="submit" value="Submit" />
</div>
</form>
Model:
public class EmailModel
{
[Required]
[Display(Name = "Name")]
public string senderName { get; set; }
[Required]
[Display(Name = "Email")]
public string senderEmail { get; set; }
[Required]
[Display(Name = "Message")]
public string message { get; set; }
}
jQuery:
<script type="text/javascript">
$.ajaxSetup({ cache: false });
$(document).ready(function () {
$(".openDialog").on("click", function (e) {
e.preventDefault();
$("<div></div>").addClass("dialog")
.attr("id", $(this).attr("data-dialog-id"))
.appendTo("body")
.dialog({
title: $(this).attr("data-dialog-title"),
close: function () { $(this).remove() },
width: 500,
height: 350,
show: { effect: "blind", duration: 1000 },
hide: { effect: "explode", duration: 1000 },
modal: true
}).load(this.href);
});
$(".close").on("click", function (e) {
e.preventDefault();
var senderName = $("#Name").val();
var senderEmail = $("#Email").val();
var message = $("#Message").text();
$.ajax({
type: "POST",
url: "/Home/SendEmail",
data: { "senderName": senderName, "senderEmail": senderEmail, "message": message },
success: function (data) {
alert("Your email was successfully sent.");
$(this).closest(".dialog").dialog("close");
},
error: function (data) {
alert("There was an error sending your email. Please try again or contact system administrator.");
$(this).closest(".dialog").dialog("close");
}
})
});
});
</script>
控制器:
public ActionResult SendEmail()
{
return PartialView("SendEmail", new EmailModel());
}
[HttpPost]
public ActionResult SendEmail(EmailModel model)
{
bool isSuccessful = true;
if (ModelState.IsValid)
{
//send email
}
return Json(isSuccessful);
}