我的jquery代码有什么问题？

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标签。

我也怀疑你不想选择所有div在5日线S，但我不知道你想选择什么，所以不能真正使任何建议。 我建议您看一下jQuery Selectors文档。

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

在那种情况下，您确实希望第5行上有$("div") 。请记住，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;
    });