ASP.NET MVC jQuery UI的对话框，查看或partialview？ [英] ASP.NET Mvc jquery ui dialog as view or partialview?

问题描述

我要显示视图或partialview的对话框。有一个在ASP.NET MVC 4默认模板（AjaxLogin.js）的例子。 AjaxLogin.js捕捉如果登录阿贾克斯。并运行jsonresult或的ActionResult。 AjaxLogin与传递参数对话框进行控制。因此，传递的参数是对我很重要。

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.

有没有跟我使用这个库为我指明表格的一个问题。或有关于这个话题的另一个JS库？

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

我为新约jQuery UI的。我米用在我的项目AjaxLogin.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的 图书馆对话框。这是简单的，因为这

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

1）添加到jQuery用户界面库的引用（从<一参阅href=\"http://encosia.com/3-reasons-why-you-should-let-google-host-jquery-for-you/\">CDN/LocalCopy)在页/布局

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

<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）的特定类添加到链接，这样我们就可以把它作为一个jQuery选择

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

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)

这篇关于ASP.NET MVC jQuery UI的对话框，查看或partialview？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！