[Let the original control Go To Hell] to create an editable dropdownlist

Source code download

Introduction

We can use ASP. the dropdownlist control provided by net is very simple to display a series of options. However, if you want to allow users to input information, it is a pity that the answer is no, you have, you have to write JavaScript or jquery. Now I will share a nice dll Control that you can easily integrate into your Asp.net page.

Knowledge Used by source code:

• ASP. NET 4.0/webforms
• C #
• Jquery/JavaScript
• CSS

Example

Background

With this control, you do not need to understand jquery, JavaScript, and CSS at all. The only thing you need is to reference it on the desired page, and correctly include the CSS and JavaScript files used. Of course, you must write it on the reference control. OK. Go to the source code. All the source code includes the test code.

How to Use

Follow these steps:

1. Reference in your Asp.net ProjectEditabledropdownlist. dll

• If you drag from the toolbox, skip steps 2 to 5.
• As for how to find it in the toolbox, you can right-click the toolbox to add

2. Register editabledropdownlist at the top of your webpage

<%@ Register Assembly="EditableDropDownList"Namespace="EditableControls" TagPrefix="editable" %>

3. Add the following files to your website

• Jquery-ui.css
• IMG/ui-bg_flat_0_aaaaaa_40x100.png
• IMG/ui-icons_222222_256x240.png
• IMG/ui-icons_454545_256x240.png
• IMG/ui-icons_888888_256x240.png
• (JavaScript files below shocould be referenced in this order below)
• Jquery-1.6.4.min.js (* or greater)
• Jquery. UI. Core. js
• Jquery. UI. widget. js
• Jquery. UI. Button. js
• Jquery. UI. position. js
• Jquery. UI. autocomplete. js
• Jquery. UI. ComboBox. js (this file is not a part of the jquery Library)

4. Add CSS and JavaScript references to the page header.

5. Add the control to the page as follows.
<editable:EditableDropDownList ID="EditableDropDownList1" runat="server"></editable:EditableDropDownList>
6. You can use the listitems method or datasource method to help top data. These examples are in the source code.
7. All right, you have done it.
What is the difference between editabledropdownlist and common controls?
There are the following points:

 

 
  
The onclick event is overwritten.

 
You can capture Events Selected or clicked items, and the page will automatically generate a PostBack

 

 
  
Autowidth adaptive Content Length

 
This function depends on the browser and<SELECT> element. This control does not use <SELECT>, But you specify the width.

 

 
  
Sorting

 
Can automatically sort items for you

 

 
  
Remove repeated items
 
  
Empty items are not allowed

 
If you want to be free, you can use"&nbsp;"Replace

 

 
  
If the dropdownlist contains no items, or enabled = "false", it is displayed as a common textbox.
 
  
However, some original features are not available, such as datatextformatstring. If you want to add them, modify the source code by yourself. Haha
 
  
Its maximum height is Px inSet in "CSS/jquery-ui.css"

 
Of course this will produce a scroll bar, the advantage is that it will not become too long...
This is the end of the Introduction. Thank you !!!
Reprinted Please note: ape world» [let the original control Go To Hell] to create an editable dropdownlist