Saturday, March 24, 2012

Working with Ajax Toolkit Controls from JavaScript

I can't seem to find any documentation on using Ajax toolkit controls from java script. I want to know how to obtain a ref to one like other controls ex. (var ctrl = document.forms[0].TextBox1); also is it possible to set properties and call methods form Java Script?

Hi,

The key to manipulate extender via javascript it to find the corresponding behavior object, and invoke methods on it.

First, you need to specify a BehaviorID for the extender. For instance:

<ajaxToolkit:CollapsiblePanelExtender ID="CollapsiblePanelExtender2"
BehaviorID="cpe2Behavior"
runat="server"
TargetControlID="panel3"
ExpandControlID="panel4"
CollapseControlID="Panel4"
Collapsed="True"
TextLabelID="lnk2"
CollapsedText="Show Details.."
ExpandedText="Hide Details.."
>
</ajaxToolkit:CollapsiblePanelExtender>

Then, use $find method to get it and invoke methods.

var cpe2Behavior =$find("cpe2Behavior");
cpe2Behavior.add_expandComplete(expandedHandler);

Currently, I'm not aware of any formal documentation about what methods or properties are available to each extender, but you can find them in the source code of it.

Hope this helps.


I tried that but theAccordion control dosn't seem to have a BehaviorID property


Accordion doesn't have this property. You can use its clientID instead.

No comments:

Post a Comment