Question

使用ASP.NET（带有C＃）和jQuery的组合，我尝试用按钮创建DropDownList。这些DropDownList将填充SQL查询。

我遇到困难的部分是只使用按钮点击添加多个部分。

如果用户单击该按钮5次，则应创建另外5个DropDownList并填充相同的数据。理想情况下，每个DropDownList都包含在表的新行中，或以类似的方式组织。

我不想在JavaScript中进行任何SQL连接。有什么建议吗？

修改

我尝试使用<asp:PlaceHolder>，然后使用它添加DropDownList。我无法弄清楚如何使用这种方法并添加多个。：

<asp:PlaceHolder ID="PlaceHolder1" runat="server"/>

protected void Add_Dropdownlist()
{
   DropDownList DropDownList1 = new DropDownList();
   PlaceHolder1.Controls.Add(DropDownList1);
}

我尝试使用jQuery复制原始DropDownList。我遇到的问题是，如果它是DropDownList，我无法弄清楚如何从jQuery获取原始<asp:DropDownList>。如果我改为将其更改为<select>，我无法弄清楚如何使用ASP（服务器）端的SQL数据填充它。

<select id="DropDownList1">
  <option value="-1"></option>
</select>

<asp:DropDownList ID="DropDownList2" runat="server"></asp:DropDownList>

function copy_Dropdownlist()
{
  newDropdownlist = jQuey.extend({}, DropDownList2);
}

简而言之，我走了几条路，但我认为它们中没有一条是对的。我是ASP.NET（谷歌教育）的新手，我认为问题在于链接客户端jQuery和服务器端ASP.NET。谢谢你的帮助。

Answer 1

（这是参考您的<asp:PlaceHolder>方法。我实际上将使用<asp:Panel>，因为这似乎更合适。

您遇到的问题似乎是DropDownList不会在回发中保留。因此，每次您创建一个新的并将其添加到PlaceHolder时，您仍然只会得到一个。

要解决此问题，您需要跟踪已创建的内容。在Page_Load，您要为DropDownList创建一个存储容器（我为此使用List<>）并将其保存在用户的“Session”中。注意!Page.IsPostBack;你只想创建一次（第一次加载页面，而不是每次你PostBack）：

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
    {
        List<DropDownList> DDLList = new List<DropDownList>();
        Session["DDLs"] = DDLList;
    }
}

现在，当您点击该按钮时，您可以

从DropDownList变量中获取当前存在的Session（如果有）
为此按钮添加新按钮，单击该列表
将所有DropDownList添加到Panel，
并将更新的列表保存回Session变量。

像这样：

protected void Button1_Click(object sender, EventArgs e)
{
    DropDownList newDropDown = new DropDownList();
    List<DropDownList> existingDropDowns = (List<DropDownList>)Session["DDLs"];
    existingDropDowns.Add(newDropDown);

    foreach (DropDownList dropdown in existingDropDowns)
    {
        Panel1.Controls.Add(dropdown);
    }

    Session["DDLs"] = existingDropDowns;
}

我不确切地知道你想要完成什么，但这应该会让你开始。

Answer 2

@ jadarnel27

非常感谢你的帮助，它让我到了我需要去的地方。我不得不做更多的工作来处理关于选择更改的帖子。这就是我最终的目标。

protected void Page_Load(object sender, EventArgs e)
{
  if (!Page.IsPostBack)
  {
      List<DropDownList> DDLList = new List<DropDownList>();
      Session["DDLs"] = DDLList;
  }
  else
  {
    List<DropDownList> existingDropDowns = (List<DropDownList>)Session["DDLs"];
    //Add all existing DropDownLists to Panel
    foreach (DropDownList dropdown in existingDropDowns)
    {
      Panel1.Controls.Add(dropdown);
      dropdown.AutoPostBack=true;
      Panel1.Controls.Add(new LiteralControl("<br/>"));
    }
    Session["DDLs"] = existingDropDowns;
  }
}

protected void Button_Click(Object sender, EventArgs e) 
{
  List<DropDownList> existingDropDowns = (List<DropDownList>)Session["DDLs"];
  DropDownList newDropDown = new DropDownList();        
  newDropDown.ID = "DDL" + existingDropDowns.Count.ToString();
  //Bind DropDownList to SQL Table
  Populate_List("mySQLTable", newDropDown, "");
  existingDropDowns.Add(newDropDown);
  //Add only new DropDownList to Panel
  Panel1.Controls.Add(newDropDown);
  newDropDown.AutoPostBack=true;
  Panel1.Controls.Add(new LiteralControl("<br/>"));
  Session["DDLs"] = existingDropDowns;
}

protected void clickSubmit(Object sender, EventArgs e)
{
  List<DropDownList> existingDropDowns = (List<DropDownList>)Session["DDLs"];
  foreach (DropDownList dropdown in existingDropDowns)
  {
      //Insert each DropDownList selected value into SQL Table
      ETS.Core.Db.Database.ExecuteNoLog("INSERT INTO myNewTable (id,text) VALUES ('" + dropdown.SelectedValue + "', '" + dropdown.SelectedItem  + "')");
  }
}

再次感谢。

单击按钮添加多个DropDownLists

2 个答案: