JSON不会停止模式窗口上的表单提交 [英] JSON not stopping form submit on modal window
问题描述
我有一个mvc项目.我在模式对话框中打开一个窗体.用户填写表格并点击保存.表单发布到控制器，但是我试图通过json进行拦截和发布.
I have a mvc project. I open a form in a modal dialog. The user fills in form and hits save. The form posts to the controller however I am trying to intercept and post via json.
寻找开发工具网络部分以及在我的json中有alert()，它没有运行，并且我认为它没有正确连接?我已经阅读了几页，看来我的json基本是正确的.
Looking in Dev tools network section as well as having alert() in my json it is not running and I am thinking it is not attached properly? I have read several pages and it seems my json is basically correct.
我知道父页面和窗口之间是有关系的...这是一个成为模式窗口的div.但是，我还不足以确定这是否是故障的一部分.
I know there is a relation between the parent page and a window...which is a div that becomes the modal window. However I don't know enough to determine if this is part of the break down.
在父窗口中，这是我的模态启动的方式.
In the parent window here is how my modal is launched.
$("#edit").click(function (e)
{
e.preventDefault();
var detailsWindow = $("#window").data("kendoWindow");
if (!detailsWindow)
{
// create a new window, if there is none on the page
detailsWindow = $("#window")
// set its content to 'loading...' until the partial is loaded
.html("Loading...")
.kendoWindow(
{
modal: true,
width: "800px",
height: "400px",
title: "@T("....")",
actions: ["Close"],
content:
{
url: "@Html.Raw(Url.Action("...", "..."))",
data: { ... }
}
}).data('kendoWindow').center();
}
detailsWindow.open();
});
上面的代码命中了控制器并填充了模型，然后按预期方式将部分加载到中心模态中.
The above code hits the controller and populates the model then loads the partial in centered modal as expected.
在模态部分中，我有这个:
In the modal partial I have this:
@using (Html.BeginForm(null, null, FormMethod.Post, new { id = "formCreateEdit" }))
{
...HTML ELEMENTS...
<input type="submit" name="save" id="save" value="@T("...")" />
}
<script>
$(function()
{
$("#formCreateEdit").submit
(function (e)
{
alert(e);
e.preventDefault(); //As we will manually submit the form
$.ajax(
{
type: "POST",
url: "@Html.Raw(Url.Action("...", "..."))",
data: $(this).serialize(),
success: function (data)
{
//here we check if database called resulted in Success/Failure
if (data.Result === "Success")
{
alert('Finis');
}
else
{
//Show error message or whatever.
}
}
})
//});
});
</script>
我也尝试拦截按钮单击事件.我可能确实做错了，所以当我尝试这样做时，下面是代码:
I have also tried intercepting the button click event. I may veru well have been doing it wrong so here is the code when I tried that:
$('#save').click(function(event)
{
event.preventDefault();
// take over and perform ajax post
alert('ddd');
$.ajax(
{
type: "POST",
url: "@Html.Raw(Url.Action("...", "..."))",
data: $(this).serialize(),
success: function (data)
{
//here we check if database called resulted in Success/Failure
if (data.Result === "Success")
{
alert('Finis');
}
else
{
//Show error message or whatever.
}
}
})
});
推荐答案
所以最终变得更加复杂，因为模态在通过控制器后从视图中加载，因此被认为是动态生成的.因此解决方案是将事件处理程序附加到文档生成后，如此处所示.我已链接到这两篇文章，以便与我分享知识的SO成员也可以投票赞成(如果它也对您有利).
So it ended up being more complicated because the modal is loaded from a view after passing through the controller...thus it is considered dynamically generated. So the solution was to attach the event handler post document generation as seen here. I have linked to these two post so that the SO members who have shared their knowledge with me can get upvotes if it benefits you as well.
这篇关于JSON不会停止模式窗口上的表单提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
