Question

我的仪表板中有一组选项卡，我想让我的用户设置他们的默认选项卡视图，以便在他们登录时加载。我通过使用一个从MVC中的数据库获取值AJAX调用Json方法。我只需要让JS / razor视图工作。关于如何解决这个问题的建议将不胜感激。

代码

 //Load Account Preferences
    function loadAccountPreferences() {
        $.ajax({
            type: "GET",
            dataType: 'json',
            url: '/JsonUserSettings/GetUserSettings',
            success: function (result) {
                loadDefaultTab(result);                    
            },
            error: function(error) {
                alert(error);
            }
        });
    }

    loadDefaultTab = function (tabId) {

        $("#dashboardTabs a: tabId").tab('show'); 
    }

Answer 1

在玩了一下之后，我找到了一个有效的解决方案！我唯一要改变的是结合Adriani6的建议，将db中的默认选项卡值存储在选项卡名称前面的＃。以下作品！

  //Load Account Preferences
    function loadAccountPreferences() {
        $.ajax({
            type: "GET",
            dataType: 'json',
            url: '/JsonUserSettings/GetUserSettings',
            success: function(result) {
                loadDefaultTab(result);
            },
            error: function(error) {
                alert(error);
            }
        });
    }

    loadDefaultTab = function(tabId) {
        let defaultTab = '#' + tabId;
        $('.nav a[href="#"]').attr("href",defaultTab).tab('show');
    }

Answer 2

正如我在评论中所指出的那样，你发布的代码是错误的，因为它总会显示最后一个标签，这里是推理...

让我们将您的代码分成几部分，看看发生了什么......

$('.nav a[href="#"]') - 在这里，您抓住所有元素（您将拥有多个，如果......）<a>并包含值为＆＃34的href;＃＆＃ 34;并包含在包含类nav的元素中。

看看这个虚拟HTML ......

<div class="nav">
    <a href="#">First</a>
    <a href="#">Second</a>
    <a href="/Settings">Third</a>
    <a href="/Help">Fourth</a>
</div>

你的数组将包含First和Second元素，并且当你在数组上执行的所有操作都应用于其中的每个元素时，你将修改这两个元素。

此时你有一个元素数组（如果你有多个元素符合上面指定的条件。

现在我们知道你有一个数组，下一个函数对该数组中的每个元素都应用相同的东西...因此每个选项卡现在都得到一个值为defaultTab的href。

最后，你打电话给.tab('show')，作为一个阵列，你的设置可能只允许一次显示一个标签，它总会显示最后一个标签。

如果您已经设置了href并且没有动态加载它们（由于您将相同的href应用于它们，您的答案就是它们），您应该修改并使用我在问题$("#dashboardTabs a: " + tabId).tab('show');下发布的选择器

为了符合您的答案，它看起来像这样

$('.nav a[href="'+defaultTab+'"]').tab('show');

这与上面的方法相同，但现在您可能会按照您的需要匹配href，并且您不会修改任何元素的值。

如何基于MVC JsonResult在页面加载时动态设置默认的boostrap选项卡

2 个答案: