MVC 5部分视图使用knockout作为jQuery对话框

时间:2014-06-02 08:46:11

标签: jquery-ui knockout-mvc

我正在使用knockout来呈现包含数据行的页面。在每一行上都有一个链接,它应该调用一个返回局部视图的控制器函数。

链接的淘汰脚本是(在foreach循环内)......

<a class="lnkEdit" data-bind="attr: {'href': '@Url.Action("ControllerActionName", new RouteValueDictionary() { { "Controller", "ControllerName" } })/'+ id}">Details</a>

脚本部分......

        $(document).ready(function () {            
        $.ajaxSetup({ cache: false });
        $("#dialog-edit").dialog({
            title: 'Details',
            autoOpen: false,
            resizable: false,
            position: ['center', 50],
            width: 700,
            show: { effect: 'drop', direction: "up" },
            modal: true,
            draggable: true,
            open: function (event, ui) {
                $(".ui-dialog-titlebar-close").hide();
                $(this).load(url);
            }
        });

        $(".lnkEdit").on("click", function (e) {
            url = $(this).attr('href');                
            $("#dialog-edit").dialog('open');
            return false;
        });

        $("#btncancel").on("click", function (e) {
            $("#dialog-edit").dialog("close");
            return false;
        });

        ko.applyBindings(new UnitViewModel());
    })

我的页面有div作为对话框的占位符...

<div id="dialog-edit" style="display: none">

问题:当我点击链接了解详情;控制器返回部分视图,但jquery无法生成对话框,因此页面将作为普通视图打开。这有什么问题?

1 个答案:

答案 0 :(得分:2)

<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

我会检查你的代码并且正在工作...... 只需添加CSS和JS。