如何使用C＃</select>动态生成jQuery以填充<select>的选项

Question

我的问题几乎说明了一切。我已经尝试了很多。我的代码编译，但不起作用（尽管出现）。此外，错误控制台中没有任何Javascript错误，所以我对我的错误感到难过。

编辑：为了让人们更清楚，我会强调问题

问题是选择框没有获得任何选项/没有填充。

这是代码隐藏中的C＃。

  protected void GroupList_SelectedIndexChanged(object sender, EventArgs e)
    {  updategroupEntry(); }

    protected void updategroupEntry() 
    {
        //this is used to populate the second group list.
        string JSCMD = "";
        JSCMD += "$('#grouplist2').empty();";
        foreach (ListItem li in GroupList.Items)
        {
            if (li.Selected)
            {
                JSCMD += "$('#groupList2').append('<option value=" + li.Value + ">" + li.Text + "</option>');";
            }
        }
        JSCMD += "alert('I send javascript correctly');";
        sendGenericscript(JSCMD);

    }

//sends scripts to the webpage
   private void sendGenericscript(string script) 
    {
        const string someScript = "alertMe";
        //send the built script to the website.
        ScriptManager.RegisterStartupScript(this.Page, this.GetType(), someScript, script, true);
    }

这一切都是由我的aspx中的SelectedIndexChanged事件调用的。

    <asp:Listbox AutoPostback="True" ID="GroupList" runat="server" Width="166px" 
                     SelectionMode="Multiple" OnSelectedIndexChanged="GroupList_SelectedIndexChanged" 
                    DataSourceID="GroupSource" DataTextField="GroupName" DataValueField="GroupID">
                </asp:Listbox>

受影响的人在这里。

  <select style="width:150px;" id="grouplist2">

  </select>

测试/调试警告框确实出现，所以我知道我的脚本正在到达页面。

这是我的页面从主页面获取jquery。

             <asp:ScriptManager ID="ScriptManager1" runat="server">
                <Scripts>
                    <asp:ScriptReference Path="~/Scripts/jquery-2.0.2.js" />
                    <asp:ScriptReference Path="~/Scripts/jqueryui.js" />
                    <asp:ScriptReference Path="~/Scripts/menubar.js" />
                    <asp:ScriptReference Path="~/Scripts/AutoSuggestBox.js" />
                </Scripts>
            </asp:ScriptManager>

以下是我页面中的内容的参考。

 <%@ Page Title="MassUpdate" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="Update.aspx.cs" Inherits="AdminSite.Update" MaintainScrollPositionOnPostback="true" %>

 <asp:Content ID="Content1" ContentPlaceHolderID="headcontent" runat="server">
 </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server" >      
        <asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server"  >
            <Scripts>
                    <asp:ScriptReference Path="~/Scripts/MassUpdate.js" />  
            </Scripts>
        </asp:ScriptManagerProxy>

Answer 1

我仍然不确定你为什么不用服务器端代码填充选择框，但是你可能需要推迟脚本执行，直到加载了DOM。你能试试这个：

string JSCMD = "$(function(){";
    JSCMD += "$('#grouplist2').empty();";
    foreach (ListItem li in GroupList.Items)
    {
        if (li.Selected)
        {
            JSCMD += "$('#groupList2').append('<option value=" + li.Value + ">" + li.Text + "</option>');});";
        }
    }