javascript – BootstrapToggle开关有条件地切换状态

我正试图在我的一个页面中使用bootstraptoggle.初始状态为关闭/禁用.

该页面加载了几个布尔值并将它们存储为隐藏文本.然后我有一个脚本,通过他们的ID查找它们.在隐藏文本后,它应该切换滑块.

我能够获取隐藏文本并进行条件检查,但由于某种原因我无法切换滑块.

这是我的代码：

$(document).ready(function () {
  var flags = [];
  var userID = '',
      toggleSlider = '';

  flags = document.querySelectorAll('*[id^="activeFlag_"]');

  flags.forEach(function (flag) {
    userID = flag.id.split('_')[1];

    // This is where i search for the hidden text
    if (flag.firstChild.data == 'True') {
      // Nothing works here.
      $('#activeToggle_' + userID).bootstrapToggle('toggle');
    }
  });
});

这是我需要使用的HTML代码：

    <p id="activeFlag_@user1">@item.activeFlag</p>
    <div class="checkbox">
        <label>
            <input id="activeToggle_user1" type="checkbox" data-toggle="toggle" data-on="Enabled" data-off="Disabled">
        </label>
    </div>

最佳答案

我想问题是,以下部分没有使用toggle的正确id $(‘#activeToggle_’userID).bootstrapToggle(‘toggle’);

您的html ID是activeToggle_user1,但上面的js部分可能会解析为#activeToggle_1.所以这里缺少文本用户.

我在这里创造了一个工作小提琴：https://jsfiddle.net/pbcrh5d2/