javascript – 动态更新FuelUX向导步骤的数量

2023年4月2日 216次阅读

我希望有人能够帮助我解决这个问题.我正在使用FuelUX向导并希望动态添加X个步骤,其中X是用户在第一个屏幕上设置的数字.额外的步骤得到了很好的补充,除了我无法弄清楚如何让向导知道它现在有不同数量的步骤开始 – 所以如果它开始有3个步骤,它仍然想要提交后的表格第3步,无论现在有多少.

再次调用$(‘#MyWizard’).wizard()似乎不起作用.在向导代码中有一个numSteps变量,但似乎无法从类外部访问它.在Rob Schmuecker(http://www.robschmuecker.com/dynamic-steps-in-fuel-ux-wizard/)的外部网站上也有这个解决方案,但不幸的是它对我不起作用,并且调用$(‘#MyWizard’).数据(‘向导’,”)正如他所建议的那样阻止向导向前迈进.

有没有人对此问题有任何建议/经验？我是JS等新手,所以也许这很明显,任何帮助都会非常感激！我正在添加步骤的代码如下：

var added_questions = 0;
function addStep()
{
  added_questions++;
  $("#end-of-questions-step-marker").before("<li id='#step-marker-q" + added_questions + "' data-target='#q" + added_questions + "'><span class='chevron'></span>Q" + added_questions + "</li>");
  $("#step3").before("<div class='step-pane' id='q" + added_questions + "'><fieldset id='q" + added_questions + "-fieldset' class='col-sm-12'></fieldset></div>");
  $("#q" + added_questions + "-fieldset").append(getQuestionPanel(added_questions));
}

最佳答案 我知道您正在寻找FuelUX 2的答案,但在即将推出的FuelUX版本3中,有一种名为
addSteps的新方法正是您想要做的.您可以查看该代码.这是在FuelUX 3.0中在(零索引)步骤​​2添加一个窗格的方法：

$('#myWizard').wizard('addSteps', index, [
  {
    badge: 'badge-customicon',
    label: 'A Step Label',
    pane: '<div>Content</div>'
  }
]);

FuelUX 3出局了.

点赞