Question

我在DropdownList更改时尝试填充2个文本框。

文本框1中的文本是ID_1的名称。
文本框2中的文字是年龄ID_1

如果我在下拉列表中选择其他选项，则会更改文本框1和文本2中的文本。

例如，

+----+-----------+--------------+--------------+
| Dropdownlist   | TextBox1     | TextBox2     | 
+----------------+--------------+--------------+
| 1              | John         | 23           |
+----------------+--------------+--------------+
| 2              | Vivian       | 43           |
+----------------+--------------+--------------+

这是我的数据库。

+----+-----------+--------------+
| id | Name      | Age          | 
+----+-----------+--------------+
| 1  | John      | 23           |
+----+-----------+--------------+
| 2  | Vivian    | 43           |
+----+-----------+--------------+

我的代码来自.aspx

$('#<%:DropDownA.ClientID%>').change(function () {
  changeData();
});

function changeData() {
  var txt1 = $('#<%:DropDownA.ClientID%>').val();
  var txt2 = $('#<%:DropDownA.ClientID%>').val();
  $('input[id="TextBox1"]').val(txt1);
  $('input[id="TextBox2"]').val(txt2);
};

changeData();

<asp:DropDownList ID="DropDownA" runat="server" CssClass="form-control" DataSourceID="SqlDataFromDatabase" DataTextField="id" DataValueField="name"></asp:DropDownList>
<asp:SqlDataSource ID="SqlDataFromDatabase" runat="server" ConnectionString="<%$ ConnectionStrings:asrsDBConnectionString %>" SelectCommand="SELECT * FROM [table]"></asp:SqlDataSource>


<input class="form-control" id="TextBox1" value="xxxx" type="text" style="color: green;" disabled>
<input class="form-control" id="TextBox2" value="xxxx" type="text" style="color: green;" disabled>

提前感谢您给我解决方案或建议。

解决方案。

  **请点击此链接查看如何拆分数据：**
  How to split the string using jQuery or JavaScript?

$('#<%:DropDownA.ClientID%>').change(function () {
  changeData();
});

function changeData() {
  var data1 = $('#<%:DropDownA.ClientID%>').val();
  var arr = data1.split(';');
  $('input[id="TextBox1"]').val(arr[0]);
  $('input[id="TextBox2"]').val(arr[1]);
};

changeData();

<asp:DropDownList ID="DropDownA" runat="server" CssClass="form-control" DataSourceID="SqlDataFromDatabase" DataTextField="id" DataValueField="name"></asp:DropDownList>
<asp:SqlDataSource ID="SqlDataFromDatabase" runat="server" ConnectionString="<%$ ConnectionStrings:asrsDBConnectionString %>" SelectCommand="Select (Name + ';' + Age) NameAge, id from [table]"></asp:SqlDataSource>


<input class="form-control" id="TextBox1" value="xxxx" type="text" style="color: green;" disabled>
<input class="form-control" id="TextBox2" value="xxxx" type="text" style="color: green;" disabled>

Answer 1

解决方案＃1：下拉列表值

此解决方案需要您将相关信息存储在Value＆amp;下拉列表的关键属性。因此，您的SQL语句需要如下所示：Select (Name + ';' + age) NameAge, Id from [table]

使用此SQL语句，您可以将DropDownList DataValueField字段更改为NameAge并在SelectIndexChanged事件上拆分键值对以填充两个关联的TextBoxe，当{发生{1}}

解决方案＃2：隐藏参考值

不太理想，但取决于你的情况。

基本上，您有一个隐藏输入字段，其中包含DropDown列表的所有可能的元数据，并根据选择提取相关信息以供在其他位置进一步使用。可以把它想象成一个平面文件样式的存储机制。

此解决方案通常需要jquery / javascript才能执行，因为数据通常会存储为json。虽然，您可以进行分层CSV类型设计。

如何通过更改下拉列表填写2个文本框？

1 个答案:

解决方案＃1：下拉列表值

解决方案＃2：隐藏参考值