MVC 数据表对话框不停留在对话框打开的位置答案

【问题标题】：MVC Datatables Dialog Not staying where dialog opensMVC 数据表对话框不停留在对话框打开的位置
【发布时间】：2013-06-25 16:45:05
【问题描述】：

我已经创建了一个视图，该视图显示了一个带有可打开 jQuery UI 对话框的可点击链接的数据表。用户希望在页面顶部有一个搜索选项（8 个下拉菜单来缩小搜索范围），然后是包含 100 条可查看记录的数据表。

如果我将数据表向下滚动到底部的可查看记录，请单击链接以打开对话框。对话框相对于点击的链接打开，但焦点回到页面顶部，导致用户向下滚动到对话框。

好的，我想我只是将焦点设置在对话框上。但是它被忽略了，这让我认为这是 MVC 领域内的东西。我什至试图将焦点包含在一个准备好的函数中，认为这将是最后的事情过程之一。

当我定义 dailog 时，它是非常基本的。我什至尝试设置位置属性，但它并没有改变问题。

有没有人遇到过这个问题，可以向我发送正确的方向吗？

查看构建数据表：

    <table id="navDatatables">
    <tbody>
        @foreach (var detailsVM in Model.DetailsVMs)
        { 
            <tr>
                <td class="standardTable">
                    <a href="#" onclick="return PVE_UseConfig.Options(@detailsVM.ConfigVersionId, @Model.UseConfigModeId);" class="smallLink">Options</a>
                </td>
                <td class="standardTable">
                    <a href="@Url.Content(@detailsVM.ViewerUrl)" target="_blank">@detailsVM.ConfigName</a>
                </td>
                <td class="standardTable">@detailsVM.ConfigType</td>
                <td class="standardTable">@detailsVM.ConfigVersionState</td>
                <td class="standardTable">@detailsVM.Organization</td>
                <td class="standardTable">@detailsVM.ProcessSet</td>
                <td class="standardTable">@detailsVM.ConfigVersionCaption</td>
                <td class="standardTable">@detailsVM.ConfigId</td>
                <td class="standardTable">@detailsVM.ConfigVersionId</td>
                <td class="standardTable">@detailsVM.ConfigOwnerName</td>
                <td class="standardTable">@detailsVM.ConfigVersionLastModified</td>
            </tr>
        }
    </tbody>
</table>

对话框代码：

    Options: function (configVersionId, useConfigModeId) {
    var output = '#modalDialog1';
    var postData = { configVersionId: configVersionId, useConfigModeId: useConfigModeId };

    $('#modalDialog1').dialog("destroy");

    $.ajax({
        url: PVE_RootUrl + 'UseConfig/Options',
        type: 'POST',
        async: false,
        data: postData,
        success: function (result) {
            $(output).html(result);
        },
        error: function (jqXHR, textStatus, errorThrown) {
            var text = jqXHR.responseText;
            var from = text.search("<body>") + 6;
            var to = text.search("</body>") - 7;
            $(output).html(text.substring(from, to));
        }
    });

    $(output).dialog({
        title: "Configuration Options",
        modal: true,
        height: 550,
        width: 600,
        resizable: false,
        draggable: false
    });
},

【问题讨论】：

请出示您的代码

标签： jquery asp.net-mvc dialog datatable

【解决方案1】：

好的，我想出了一个解决我的问题的方法。我添加了以下代码。变量 [output] 是对话框的元素。变量 [selector] 是链接点击的对象。所以，我延迟让一切都完成，然后设置焦点并创建对话框。

我的解决方案：

        //Add this time out function to ensure that the window is loaded.
    var fnTimeout = function () {
        setTimeout(function () {

            if (window.document.readyState == "complete") {
                $(selector).focus();
                var position = $(selector).position();
                window.scrollTo(position.left, position.top);

                $(output).dialog({
                    title: "Configuration Options",
                    modal: true,
                    height: 550,
                    width: 600,
                    resizable: false,
                    draggable: false
                });
            }
            else {
                fnTimeout();
            }
        }, 100);
    };

    fnTimeout();

【讨论】：