Question

您好;我有个问题。我想在网页上打开一个弹出窗口（Jqueryui弹出窗口）。但是我不能。如何正确使用？

查看：


    grid.Column("", format: (item) => Html.ActionLink("Click", "", "", new { @customerId = ConvertUtil.ToInt(item.Id) }, new { @class = "popupLink" })),

OR

   grid.Column("", format: (item) => Html.ActionLink("Click", "Edit", "Customer", new { @customerId = ConvertUtil.ToInt(item.Id) }, new { @class = "popupLink" })),

Jquery Code:


   $(".popupLink").click(function () {
                 jQuery('#dialog').dialog('open');
        });

控制器



    public ActionResult Edit()
        {
            return View();

        }

我还需要id值。不仅弹出。我想打开编辑弹出窗口。如何在任何一行打开编辑弹出窗口？

Answer 1

首先，您需要停止点击事件的默认操作

$(".popupLink").click(function (e) {
    $('#dialog').dialog('open');

    e.preventDefault();
});

这将显示空对话框（当然，如果您的视图中有#dialog容器）。在显示对话框之前，您必须加载正确的视图。我会这样做：

var url = $(this).attr('href');
$('#dialog').load(url);

最后，整个解决方案：

$(".popupLink").click(function (e) {
    $('#dialog').load($(this).attr('href'));
    $('#dialog').dialog('open');

    e.preventDefault();
});

Answer 2

可以在ActionLink上重用以下解决方案，而无需修改源文档。在加载完成之前，它也不会显示对话框：

$("a.popuplink").live("click", function (evt) {
    evt.preventDefault();        
    $("<div></div>").insertAfter(this);
    $.ajax({
        url: this.href,
        context: this
    }).done(function (data) {
        $(this).next('div').html(data);
        $(this).next('div').dialog();
    });
});

如何在mvc 3 Grid上使用JqueryUi弹出窗口打开编辑弹出窗口？

OR

控制器

2 个答案: