Question

我在Tridion CMS扩展程序中的功能区工具栏按钮上添加了一个按钮。点击该按钮，弹出页面将显示两个下拉菜单。通过更改第一个下拉控件中的值，我应该填充第二个下拉控件的值。在我的情况下，我使用ASP drop down list控件。暂时我会将要填充的值硬编码到java脚本中的第二个下拉列表中。对于此要求，我使用以下代码，但我无法填充值（不识别标记）。

Java脚本代码：

ABC.WCMS.RTFExtension.Popups.ButtonPopup.prototype._populate = function () {    
    var selectedValue = $('#functionalcomponent').value;//First dropdown selected value
    var dropdownId = $("#Dd");//Second Dropdown Control

        switch (selectedValue) {

            case "Home Ware":
                dropdownId.append($("<option> </option>").val("Select Sub-Category").html(""));
                dropdownId.append($("<option> </option>").val("Air-Conditioners/Coolers").html("Air-Conditioners/Coolers"));              
                break;
            case "Education":
                dropdownId.append($("<option> </option>").val("Select Sub-Category").html(""));
                dropdownId.append($("<option> </option>").val("Colleges").html("Colleges"));
                break;
            default:
                dropdownId.append($("<option> </option>").val("Select Sub-Category").html(""));
                dropdownId.append($("<option> </option>").val("No Value").html("No Value"));

        }
    return true;
}

ASPX控制：

<%--Dropdown1--%>
<asp:DropDownList ID="functionalcomponent" runat="server"></asp:DropDownList>
<%--Dropdown2--%>
<asp:DropDownList ID="Dd" runat="server"></asp:DropDownList>

如何从外部JavaScript文件中填充第二个下拉列表的值？

Answer 1

您可以使用以下方法，而不是按需添加值：

预先将所有项目添加到DOM。
使用jQuery逻辑隐藏所需的项目。

您可以参考以下帖子获取提示Hide options in a select list using jQuery

请同时查看jQuery disable SELECT options based on Radio selected (Need support for all browsers)

Answer 2

我最近在GUI扩展上工作，我们根据另一个下拉列表的值填充下拉列表。当我使用javascript填充时，我有以下代码：

$j(c.SystemDropDown).append("<option value=\"" + value + "\">" + value + "</option>");

正如您所看到的，我的示例附加了整个<option>标记，您使用.val()指定了哪个标记，也许您可以尝试这种方式？

我的版本效果很好：）

如何使用JavaScript中的值填充下拉列表？

2 个答案: