Question

我已在下面提供了我的代码，

        $(function() {
        $("get-reservation-id").click(function() {
            $(this).load("<%=Url.Action("GetReservation", "ModalPopup") %>", 
            function() {
                $("<div>").dialogr({
                    autoOpen: false,
                    width: 700,
                    title: 'Car Rental Application',
                    modal: true,
                    overlay: {
                        opacity: 0.5,
                        background: "black"
                    }
                });
            });
        });
    });

此代码不会弹出jquery ui对话框。

get-reservation-id ：是放置在锚标记中的图像

GetReservation ：是局部视图

ModalPopop ：是控制器的名称（我有一个返回GetReservation View的操作）

任何想法为什么这不起作用。另一方面，我写了一些有效的代码。见下文

工作代码：

$("#vehicle-search-id").click(function() {
        $("#vehicle-search-id").load("/ModalPopup/VehicleSearch", 
            function() {
                $("#vehicle-search").dialogr({ 
                    width: 700, 
                    modal: false, 
                    title: 'Car Rental Application'
                });
        });
    });

我选择不使用此功能的原因是因为我想使用<%=Url.Action("GetReservation", "ModalPopup") %>代替/ModalPopup/VehicleSearch，并希望使用比$("<div>").dialogr({更常见的$("#vehicle-search").dialogr({

非常感谢

我的目标

我想使用Jquery对话框创建一个弹出窗口并放置一个部分视图。

Answer 1

您的jQuery选择器格式错误。使用$("#get-reservation-id")选择具有该ID的元素，使用$("div")选择所有div代码。

我还怀疑你不想在你的第5行选择所有div，但我不知道你做什么想要选择，所以不能真的提出任何建议。我建议您查看jQuery Selectors文档。

编辑：我想我知道你在做什么。您正在从Url.Action("GetReservation", "ModalPopup")获取HTML响应，并希望显示一个模式对话框，其中包含从该响应中的（可能只有）div中获取的内容。

在这种情况下，您确实需要$("div")在您的第5行。请记住，jQuery选择器的工作方式与CSS选择器类似 - $('div')选择所有div个元素，$('#foo')选择id为“foo”的元素，$('.bar')选择类别为“bar”的所有元素。

Answer 2

我想你想要这个：

$(function() {
    $("get-reservation-id").click(function() {
        var that = $(this);
        that.load('<%=Url.Action("GetReservation", "ModalPopup") %>', 
        function() {
            that.dialog({
                autoOpen: false,
                width: 700,
                title: 'BMS Car Rental Application',
                modal: true,
                overlay: {
                    opacity: 0.5,
                    background: "black"
                }
            });
        });
    });
});

Answer 3

我注意到你在第一个例子中将autoOpen选项设置为false。因此，您问题中的第一个代码段将创建一个jQuery对话框，但不会打开它。我建议将autoOpen设置为true（默认值）或包含一行代码以在其他地方打开对话框。

Answer 4

这是经过纠正的代码

$(function() {

        $("#get-reservation-id").click(function() {

            $("<div>").dialogr({
                title: 'Title',
                minHeight: 400,
                minWidth: 600,
                width: 800,
                height: 600,
                modal: true,
                open: function() {
                $(this).load('<%= Url.Action("GetReservation", "ModalPopup") %>');
                },
                buttons: {
                    "Ok": function() { $(this).dialogr("close"); },
                    "Cancel": function() { $(this).dialogr("close"); }
                }
            });
        });

        return false;
    });

我的jquery代码有什么问题？

4 个答案: