Question

在ASP.NET MVC中，我试图通过调用驻留在外部js文件中的函数来显示jqueryUI模式对话框。这样做的原因是我希望在某处编写一个js方法，并使用一些参数调用它，而不是在每个页面上进行复制。

这是我的CustomFunctions.js文件：

function CustomFunctions() { };

CustomFunctions.prototype.loadModalDialog = function (dialogDivID, callerElementDivID, dialogSize, actionControllerName, container)
{
  var dialogElement = $('#' + dialogDivID);
  var callerElement = $('#' + callerElementDivID);
  dialogElement.dialog
  (
    {
        autoOpen: false,
        show: "slide",
        width: dialogSize,
        resizable: false,
        modal: true
    }
  );

callerElement.click(function() 
{
    dialogElement.load("@Url.Action(" + actionControllerName +")", function() 
    {
        $(container).dialog('open');
    });
    return false;
})

}

现在，在我的List.cshtml视图中，我写了以下内容：

@Html.ActionLink(
        "click me", 
        "List", 
        new {string.Empty},
        new { onclick = "Javascript:showModal();" }
        );

@Scripts.Render("~/bundles/custom");
<script>
    function showModal()
    {
        var custom = new CustomFunctions();
        custom.loadModalDialog("my-dialog", "show-modal", 400, "List", this);
    }
</script>

问题是模态对话框没有弹出。在客户端调试时，它进入loadModalDialog，它正确找到所有变量，它遍历所有的js代码，不会抛出任何错误（这让我感到困惑），但没有显示对话框。

我错过了什么吗？谢谢，

Answer 1

这不适用于外部js文件

“@ Url.Action（”+ actionControllerName +“）”

当与模板内联时，这是有效的，因为临时板在被发送到客户端之前被激活和渲染。当这被放入一个exneral js文件时，它是一个文字字符串。

custom.loadModalDialog（“my-dialog”，“show-modal”，400，“List”，这/ /可能不是你所期望的* /）;

在代码中传递this传递文档或窗口对象。然后尝试在容器上调用dialog('open')，这不是您期望的对话框对象。

还有在document.ready事件之外调用jquery的问题。除非在页面加载后调用showModal()，否则jquery函数将无效。

任何最新的bowsers都有一个用于调试js的javascript / console。

从外部js中的函数加载jqueryui模态对话框

1 个答案: