PopupControlExtender set focus to a control on popup
I have a project with a complex user control used to select some values in hierarchic categories, it was realized with the UpdatePanel, it supports searching, selection by cascade of combo and much more, everything works great, but performances are not so good.
Now I decide to create another version that use jQuery to do real ajax calls and manage json data to maximize performances, but I face a problem
- I need to create a UserControl.
- I can have more than one instance of this user control in a single page (but I want a single jquery script)
- The user want to move the focus on a specific part of my control when the popup opens.
If you know the microsoft ajax library you already know the $find() function, and you should know also that you can use a particular property called BehaviorID to give a unique Id to the client part of a component. A partial solution to my problem can be found here (look in the end of the post). In that post the PopupControlExtender was declared in this way
- Error: Sys.InvalidOperationException: Two components with the same id ‘pce’ can’t be added to the application. *
The reason is that BehaviorID must be unique in the page. The solution is quite simple, first of all I insert this function in the jQuery script.
This is the function I want to register with the add_shown method, it simply get the textbox control with the _parentElement field of the pce object, then it is time of some magical jQuery selector. Each of my usercontrol instance is rendered inside a div with the class hierarchicmaindiv, now I want to find the textbox wiht txtSearch id, but I want only the one related to the specific popup.
To reach this goal we need to find the containing div with the parents jQuery function, then with find() function we look for a textbox with the txtSearch id but that is also contained in the div. With this little trick I’m sure that you can drop multiple instance of the control in the page without any problem because when the popup opens, I can find the txtSearch textbox inside the popup even when there are multiple txtSearch textbox in the whole page.
Now I need to wireup this function to the add_shown method of the popupcontrolextender, and this can be obtained with this little snippet on the PreRender server events of the UserControl
Tags: asp.net Microsoft Ajax