FuelUX向导如何禁用特定步骤

FuelUX Wizard How to disable specific steps?

本文关键字:何禁用 向导 FuelUX      更新时间:2023-09-26

在我的web表单中,我使用的是fuelux向导(链接:http://getfuelux.com/javascript.html#wizard),我有不同角色的人来到这个页面。我需要的是能够根据页面加载时获得的一些数据"禁用"向导的某些步骤。我相信这与它的样式有关,但我还没有找到我需要的东西。

例如,

我有步骤1-6,假设一个用户来到这个页面。我认为他是数据架构师,因此我需要禁用步骤4和6。我有几个特定的角色,我需要为每个单独的角色禁用某些选项卡组合。

这可以通过调用一些javascript的燃料ux基于什么角色我识别用户在代码后面?我需要对特定步骤进行哪些更改才能使用户无法访问它?

编辑:

下面是我的步骤:

    <ul class="steps">
            <li data-step="1" data-name="Documentation" class="active"><span class="badge">1</span>Documentation<span class="chevron"></span></li>
            <li data-step="2" data-name="Business"><span class="badge">2</span>Business<span class="chevron"></span></li>
            <li data-step="3" data-name="Application"><span class="badge">3</span>Application<span class="chevron"></span></li>
            <li data-step="4" data-name="Data"><span class="badge">4</span>Data<span class="chevron"></span></li>
            <li data-step="5" data-name="Infrastructure"><span class="badge">5</span>Infrastructure<span class="chevron"></span></li>
            <li data-step="6" data-name="Security"><span class="badge">6</span>Security<span class="chevron"></span></li>
     </ul>

我的问题是,是否有一种方法可以从后面的代码禁用某些数据步骤?

我已经找到了一种方法,通过在我的代码后面声明int数组,然后在javascript中初始化数组的地方直接访问它们。它看起来像这样:

背后的代码:

//Check which steps to disable
            if (role.Contains("Data"))
            {
                disabledSteps = new int[] {5, 5};
            }
            else if (role.Contains("Infra"))
            {
                disabledSteps = new int[] {4, 5};
            }
            else if (role.Contains("Security"))
            {
                disabledSteps = new int[] { 4, 4 };
            }
然后,使用我也在后面的代码中声明的javascriptserializer, javascript看起来像:

var disabledSteps = <%= serializer.Serialize(disabledSteps) %>;
        for(var i in disabledSteps){
            alert(disabledSteps[i]);
            $('#myWizard').wizard('removeSteps', disabledSteps[i], 1);
        }