选择列表框后，以模态更新文本框

Question

我在Bootstrap模式下有一个列表框和一个文本框。我需要使用从列表框中选择的值来更新文本框。我的问题是为了从列表框中获取选择的值，我需要执行自动回发。回发导致模式关闭。

这是我的代码背后：

    protected void lbConBillOLDocNumber_SelectedIndexChanged(object sender, EventArgs e)

    {

         txtConBillOLDocNumber.Text = lbConBillOLDocNumber.SelectedItem.Text;

    }

我需要将选定的文本值从列表框中放到文本框中。我不知道我得到了正确的值，因为上面代码中的警报显示了正确的值，（但是由于模式关闭，所以我不知道是否正在更新文本框。）我需要用选定的值填充文本框ListBox的模式，我需要保持打开状态的模式。我意识到我可能会遇到所有错误，因此欢迎提出任何建议的改进。

Answer 1

您可以使用AJAXUpdatePanel作为下面的示例，以消除每次回发时刷新整个页面的要求，并允许针对您的情况局部渲染特定区域，这将成为模态主体。的HTML<form id="form1" runat="server">&nbsp; &nbsp; <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>&nbsp; &nbsp; <!-- Button trigger modal -->&nbsp; &nbsp; <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">&nbsp; &nbsp; &nbsp; &nbsp; Launch demo modal&nbsp; &nbsp; </button>&nbsp; &nbsp; <!-- Modal -->&nbsp; &nbsp; <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">&nbsp; &nbsp; &nbsp; &nbsp; <div class="modal-dialog" role="document">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="modal-content">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="modal-header">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button" class="close" data-dismiss="modal" aria-label="Close">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span aria-hidden="true">&times;</span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="modal-body">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <%-- AJAX UpdatePanel section--%>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <asp:UpdatePanel ID="UpdatePanel1" runat="server">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <ContentTemplate>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </asp:DropDownList>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </ContentTemplate>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </asp:UpdatePanel>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="modal-footer">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button" class="btn btn-primary">Save changes</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </div></form>背后的代码protected void Page_Load(object sender, EventArgs e){&nbsp; &nbsp; if (!IsPostBack)&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; // Bind DropDownList1 with some testing data&nbsp; &nbsp; &nbsp; &nbsp; DropDownList1.Items.Add(new ListItem() { Text = "Item 001", Value = "1" });&nbsp; &nbsp; &nbsp; &nbsp; DropDownList1.Items.Add(new ListItem() { Text = "Item 002", Value = "2" });&nbsp; &nbsp; &nbsp; &nbsp; DropDownList1.Items.Add(new ListItem() { Text = "Item 003", Value = "3" });&nbsp; &nbsp; &nbsp; &nbsp; DropDownList1.Items.Add(new ListItem() { Text = "Item 004", Value = "4" });&nbsp; &nbsp; &nbsp; &nbsp; DropDownList1.Items.Add(new ListItem() { Text = "Item 005", Value = "5" });&nbsp; &nbsp; }}protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e){&nbsp; &nbsp; TextBox1.Text = DropDownList1.SelectedValue;}

Answer 2

最终弄清楚了这个问题。该问题是由显示列表框的下拉菜单引起的。只要在列表框中单击任何内容，下拉菜单就会关闭，并且基本上使选择无效并关闭模式。我不得不停止传播下拉列表。一旦我做到了，UpdatePanel就完成了它的工作。我在下拉菜单中添加了一个ID，并使用以下代码来防止在单击ListBox时将其关闭。&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $('#myDropdown .dropdown-menu').on({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "click": function (e) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; e.stopPropagation();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; });我希望这对其他人有帮助。快乐的编码。