Author:
Cuike519 column
http://blog.9cbs.net/cuike519/
This article details how to display the DataGrid when you click DropDownList, then select the appropriate item from the DataGrid.
I have discovered it online, I have a cool drop-down selection box. Today I also wrote one here, this method aims to explain a solution to a solution, the method can expand into a custom control, because of time is limited, I only Provide a page implementation of this method. Of course you can play your ability to make more beautiful.
Problem Description: We often encounter such problems when using DropDownList (at least I have encountered), showing a relatively complicated content in a small area, hoping that the selected people are clear about what to choose. Understanding, we need to display the user's very detailed information when you click the drop-down box, but we are hard to do due to the limitations of the layout or due to the limitations of the pull-down box itself.
Solution: We want to have a layer to show a rich content. Since we are rich, we think that it should be a DataGrid control, so well, we use DataGrid and TextBox and Button to implement this feature.
I need to understand the knowledge: a little bit of JS, a little ASP.NET, there is a little patience
Below is the code:
We need a layer to put our DataGrid, we call him Divparent. code show as below:
Then we need a TextBox and a Button. TextBox is a server control. Button is a client control code as follows:
We set the Button's font to Marlett This can use "6" to display a drop-down arrow. Of course you can also use a picture.
Then DataGrid, the code of the DataGrid is as follows:
We used a layer to hide the DataGrid so that users couldn't see this DataGrid, and the DataGrid was only displayed when they were selected.
You can also use PowerDataGrid to display a beautiful DataGrid object while securing your head. (Please contact PowerDataGrid
Www.foxhis.com/powermjtest/ Download)
DataGrid of the fixed head can refer to my other article (http://www.9cbs.net/develop/read_article.asp?id=25538)
The above is the client's representation, the following is the client logic to achieve this effect, which is implemented by 3 JS functions. Code is as follows:
