Question

我有一个fancybox弹出窗口，里面有一个表单。当表单发布时，一切正常但发布后，它会重定向到视图并在整页上显示。

我想要的是发布弹出窗口以及要关闭的花式框。

这是我的代码

主页这会打开弹出窗口

<%: Html.ActionLink("Add Person Box", "AddTest", Nothing, New With {.class = "fbox"})%>

    <script type="text/javascript">
        $(document).ready(function () {

            $(".fbox").fancybox();

        });
    </script>

弹出页面

<% Using Html.BeginForm() %>
    <input type="submit" value="Save Person" />

<% End Using %>

再次提交正常但在全屏模式下重定向到自身。我只想要张贴表格并关闭精美的盒子。

Answer 1

尝试将属性onsubmit="javascript:parent.jQuery.fancybox.close();""添加到您的form代码

Answer 2

要避免重定向，您需要将其设为网络方法。

Answer 3

使用jQuery ajax发布Popup表单的内容。从服务器操作方法获得响应后，请使用javascript将其关闭。

Answer 4

我会使用JQuery Form插件。劫持表单并执行ajax请求。请求完成后，您只需关闭回调函数中的精美框（只要没有错误）。

http://jquery.malsup.com/form/

// bind to the form's submit event 
$('#myForm2').submit(function() { 
    // inside event callbacks 'this' is the DOM element so we first 
    // wrap it in a jQuery object and then invoke ajaxSubmit 
    $(this).ajaxSubmit({
       success : function (result) { $.fancybox.close() }
    }); 

    // !!! Important !!! 
    // always return false to prevent standard browser submit and page navigation 
    return false; 
});

ASP.NET MVC如何在表单上关闭fancybox

4 个答案: