ASP.NET Mvc jquery ui对话框作为视图还是部分视图？

I want to show view or partialview on dialog. There is an example in ASP.NET Mvc 4 default template (AjaxLogin.js). AjaxLogin.js catches if login is ajax. And runs jsonresult or actionresult. AjaxLogin control this with passing parameter to dialog. So passing parameter is important for me.

我想在对话框上显示视图或部分视图。 ASP.NET Mvc 4默认模板（AjaxLogin.js）中有一个示例。如果login是ajax，AjaxLogin.js会捕获。并运行jsonresult或actionresult。 AjaxLogin通过将参数传递给对话框来控制它。所以传递参数对我来说很重要。

Is there a problem with my use of this library for my specified forms. Or is there another js library about this topic?

我对指定表单使用此库是否有问题。或者是否有关于此主题的另一个js库？

I m new about jquery ui. I m using AjaxLogin.js in my project now, for other forms. And they work. Should I continue to use.

我是关于jquery ui的新手。对于其他形式，我现在在我的项目中使用AjaxLogin.js。他们工作。我应该继续使用吗？

Thanks.

谢谢。

2 个解决方案

#1

You may use jQuery UI library for the dialog. It is simple as this

您可以使用jQuery UI库进行对话。这很简单

1) Add a reference to the jQuery UI library( Refer from the CDN/LocalCopy) in the page/layout

1）在页面/布局中添加对jQuery UI库的引用（参见CDN / LocalCopy）

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />

2)Add a specific class to the links so that we can use that as a jQuery selector

2）向链接添加一个特定的类，以便我们可以将其用作jQuery选择器

@Html.ActionLink("Email", "Details", "Customers", null, new { @class = "popupLinks" })

3) Bind the Diloag functionality to those links on the DOM ready event

3）将Diloag功能绑定到DOM ready事件上的那些链接

<script type="text/javascript">
    $(function(){
        $(".popupLinks").click(function (e) {
            var url = this.href;
            var dialog = $("#dialog");
            if ($("#dialog").length == 0) {
                dialog = $('<div id="dialog" style="display:hidden"></div>').appendTo('body');
            }
            dialog.load(
                url,
                {}, // omit this param object to issue a GET request instead a POST request, otherwise you may provide post parameters within the object
                function (responseText, textStatus, XMLHttpRequest) {
                    dialog.dialog({                       
                        close: function (event, ui) {                            
                            dialog.remove();
                        },
                        modal: true,                            
                         width: 460, resizable: false
                    });
                }
            );           
            return false;           
        });
    });
    </script>

Now clicking on the link will show the content of the result of Details action method of Customers controller. ( you may change this according to your scenario)

现在单击链接将显示Customers控制器的详细信息操作方法的结果内容。（你可以根据你的场景改变这个）

#2

If you are comfortable with the functionality and it works for you, then go for it. I haven't used the ajaxlogin.js, so I can't comment directly on it, but I have used FancyBox as my modal dialog for displaying partial views with great success.

如果您对功能感到满意并且它适合您，那就去吧。我没有使用过ajaxlogin.js，所以我不能直接对它进行评论，但是我使用FancyBox作为我的模态对话框来显示部分视图并取得了巨大的成功。

#1