在模态中将选项附加到 select

Question

我正在尝试将选项列表附加到模式中的 select，但它们没有出现，正在寻找想法！

主页加载后，我通过单击运行的 link 触发模式：

$("#tankTransfer").click(function (e) {
   $('#modalBox').load('modalTest.html', function () {
               // init select ----------
               document.getElementById("textId").innerHTML = "Testing Modal Select Append";
               $('#selectId').append($("<option></option>").attr("optionName", 
                                     "optionValue").text("optionText"));
               document.getElementById("textId").innerHTML = "Select should have optionText in the list";
           });
        });

我还尝试通过以下方式插入选项，而不是使用 jQuery：

       var spinner = document.getElementById("selectId");
       spinner.add(option, option.text);
       spinner.refresh();

None以上作品。我还尝试通过在模态中单击按钮来调用 append/add。但它仍然没有 append/add...我尝试将 selectId 切换到主页正文中的 select到 append/add 到那个，它显示得很好。它只是不会显示在模态上。 textId 更新得很好，显示代码没有出错，也没有抛出任何错误。

此外，我尝试在 jQuery append:

之后添加代码

    $('#selectId').change();

在模态中使用这个：

 $('#selectId').change(function (e) {
        var oValue = getSpinnerNameAttributeValue('selectId', "optionName");
        alert(oValue);
    });

然后我得到附加的 optionValue。

这是 #modalBox 的示例：t 附加的选项值。

<div id="modal" class="modal">
    <div class="modal-content">
        <span class="close">&times;</span>
        <form class="form-horizontal" role="form">
            <div class="form-group">
                <label class="col-sm-4 control-label" id="textId">From Tank</label>
                <div class="col-sm-8">
                    <select class="form-control" id="selectId">
                        <option optionName="-1">None</option>
                    </select>
                </div>
            </div>
        </form>
    </div>
</div>

我错过了什么？感谢您提供任何和所有见解、解决方案和理解！

Answer 1

从这里的社区缺乏创造性的答案来看，我猜想在模态中附加到 select 没有问题。

我终于在我的代码中找到了这个错误：我在主体中有一个 select 与模态中的元素 id 相同。因此，当附加到 select 时，仅附加了主体中的 select，而模态的 select 保持不变。

在模态中将选项附加到 select

Appending options to select in modal

html

javascript

modal-dialog