在实现一个ASP.NET的DropDownList编辑 [英] Implementing an editable DropDownList in ASP.NET

问题描述

什么是实施ASP.NET是编辑，而无需使用第三方组件DropDownList的最优雅的方式。

What's the most elegant way of implementing a DropDownList in ASP.NET that is editable without using 3rd party components.

作为最后的手段，我可​​能会尝试使用一个TextBox与图像，以下拉列表中的AutoCompleteExtender;或一个TextBox重叠与一些JavaScript一个HTML的选择，以填补从选择值的文本框。但我真的很希望能有一个更简洁和维护的解决方案。

As a last resort I will probably try using a TextBox with an AutoCompleteExtender with an image to 'drop down' the list; or a TextBox overlapping a HTML Select with some JavaScript to fill values from the Select to the TextBox. But I'm really hoping there is a more terse and maintainable solution.

先谢谢了。

推荐答案

您可以按照这个简单的例子为可编辑DROPDOWNLIST上$ C使用标准的ASP.NET TextBox和DropDownList控件与一些JavaScript结合$ C项目。

不过，code并没有为我工作，直到我添加了一个参考来获取文本框和DropDownList的ClientID的值：

However, the code did not work for me until I added a reference to get the ClientID values for the TextBox and DropDownList:

<script language="javascript" type="text/javascript">

function DisplayText()
{
    var textboxId = '<% = txtDisplay.ClientID %>';
    var comboBoxId = '<% = ddSelect.ClientID %>';
    document.getElementById(textboxId).value = document.getElementById(comboBoxId).value;
    document.getElementById(textboxId).focus();
}
</script>    

<asp:TextBox style="width:120px;position:absolute" ID="txtDisplay" runat="server"></asp:TextBox>

<asp:DropDownList ID="ddSelect" style="width:140px" runat="server">    
    <asp:ListItem Value="test1" >test1</asp:ListItem>    
    <asp:ListItem Value="test2">test2</asp:ListItem>    
</asp:DropDownList>

最后，在后面就像在原来的例子中，code，我增加了以下内容页面加载：

Finally, in the code behind just like in the original example, I added the following to page load:

protected void Page_Load(object sender, EventArgs e)
{
    ddSelect.Attributes.Add("onChange", "DisplayText();");
}

我把所有上述code在自己的ASCX用户控制，使之在我的项目中重用。不过，如果你需要的只是一个特定网页上编辑的DropDownList的code如上只有psented $ P $工作。

I placed all of the above code in its own ASCX User Control to make it reusable across my project. However, the code as presented above only works if you require just one editable DropDownList on a given page.

如果需要支持在单页上的多个自定义DropDownList控件，有必要设置JavaScript函数名是唯一的，以避免冲突。通过再次使用的ClientID做到这一点：

If you need to support multiple custom DropDownList controls on a single page, it is necessary to set the JavaScript function name to be unique to avoid conflicts. Do this by once again using the ClientID:

的在ASCX文件：的

function DisplayText_<% = ClientID %>(){...}

的在code背后：的

/// ...
ddSelect.Attributes.Add("onChange", "DisplayText_" + ClientID + "();");
///..

这是避免使用第三方控件的方法之一。

This is one way to avoid using 3rd party controls.

这篇关于在实现一个ASP.NET的DropDownList编辑的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！