如何在页面加载时使用 c# 在 <select> 标记中添加选项？答案

【问题标题】：how to add options in <select> tag at page load dynamically using c#?如何在页面加载时使用 c# 在 <select> 标记中添加选项？
【发布时间】：2016-09-05 02:47:15
【问题描述】：

我正在使用 jQuery ajax 从数据库中填充级联的 <select> 元素。只有一个问题：我无法将顶部的默认“选择程序”选项动态添加到我的第一个 <select> 元素。 C# 代码什么也不做，但我使用了 jQuery prepend 方法，它增加了值；但是页面加载时它不会显示。而不是首先显示它从数据库中获取的第一个值。这是我从数据库中检索数据的代码，我在页面加载时调用它：

   public void GetPrograms()
    {
        string CS = ConfigurationManager.ConnectionStrings["DBCS"].ConnectionString;
        using (SqlConnection con = new SqlConnection(CS))
        {
            SqlCommand cmd = new SqlCommand("spGetPrograms", con);
            SqlDataAdapter adp = new SqlDataAdapter(cmd);
            DataSet ds = new DataSet();
            adp.Fill(ds, "Programs");
            con.Open();
            program.DataSource = ds;
            program.DataValueField = "ProgID";
            program.DataTextField = "ProgName";
            program.DataBind();
            con.Close();
        }
    }

这些是页面的屏幕截图：

page loaded without select program option displayed

select option is there but is not selected by default

这是jquery代码

   $("#program").prepend(new Option("Select Program", "0"));

【问题讨论】：

在 asp.net 中的下拉菜单？
不，我使用 HTML 中的
@KanchanSharma - 那么你如何为你的 html 选择元素获取 .DataSource 属性？？？
那你为什么显示 C# 代码？
因为我使用的是 runat="server' 属性

标签： c# jquery html ajax

【解决方案1】：

您可以在服务器端执行此操作

program.Items.Insert(0, "Select Program");

更新正如 OP 想要从客户端做的那样：

<select id="program">
      <option>Option 1</option>
      <option>Option 2</option>
      <option>Option 3</option>
    </select>

jQuery:

$(document).ready(function(){

  $("select#program").prepend("<option value='0'>Select</option>");
  $("select#program").val("0");
  //alert($('option').length);
});

小提琴 - https://jsfiddle.net/wj00esyz/

【讨论】：

我已经尝试过了，但没有成功。即使它没有将其添加到列表中
看到您的评论说您正在使用 html Select...想知道您的其他值是如何填充到下拉列表中的...
查看我在问题中粘贴的代码，它正在被填充
@KanchanSharma - 很高兴我能帮上忙。如果这回答了您的问题，请标记为答案。

【解决方案2】：

同时添加

program.SelectedIndex = 0;

插入“选择程序”使其被选中后。

【讨论】：