views:

366

answers:

2

Problem How do I capture and assign the events on an Ajax Toolkit autoomplete control using a script control on the script file?

Explanation

I basically created a script control to combine a textbox and an autocoplete control so that I could have a working generic control for an autocomplete. The next step was to add things like a processing image while it searches for it's items. It seemed easy enough.

protected override IEnumerable<ScriptDescriptor> GetScriptDescriptors()
{  
  ScriptControlDescriptor desc = new ScriptControlDescriptor   
     ("NDI.WebControls.Client.GenericAutoComplete", this.ClientID);
  desc.AddProperty("autoCompleteID", autoComplete.ClientID);

  return new ScriptDescriptor[] { desc };
}

And then on the javascript the normal:

initialize: function()
{
  this._autoComplete = $get(this._autoCompleteID);  
  //this._autoCompleteID does have a value

  this._autoCompleteClientPopulating = 
     Function.createDelegate(this, this.handleAutoCompleteClientPopulating);

  $addHandler(this._autoComplete, "clientPopulating", 
     this._autoCompleteClientPopulating);

  NDI.WebControls.Client.GenericAutoComplete.callBaseMethod(this, 'initialize');
},

Now this should work BUT it doesn't. Why? Because apparently there is no autocomplete control rendered to the page like a normal control would be. So when it gets to the $get part it comes up null despite the ID property having a text property. (IE the control doesn't exist)

Is this possible to do or do I have to use the OnXyz properties server side to assign a method? As in:

  autocomplete.OnClientPoplating = someScript;
A: 

ANSWER

Booyah Found it. Turns out the autocomplete has a built in way to access it's events in javascript:

Server side you have to set the BehaviorID:

autoComplete.BehaviorID = "autoCompleteBehavior";

And then set it in the GetScriptDescriptors method:

protected override IEnumerable<ScriptDescriptor> GetScriptDescriptors()
{
  ScriptControlDescriptor desc = new 
   ScriptControlDescriptor("NDI.WebControls.Client.GenericAutoComplete", ClientID);
   desc.AddProperty("autoCompleteID", autoComplete.BehaviorID);

  return new ScriptDescriptor[] { desc };
}

Of course you have to add the properties script side to capture that value, and once you do that you have to use Find to get it. Then you have to create the event handler:

this._autoComplete = $find(this._autoCompleteID);
this._onAutoCompletePopulating = 
   Function.createDelegate(this, this.handleOnAutoCompletePopulating);

Finally use the built in event setter in the autocomplete control (Behavior object):

this._autoComplete.add_populating(this._onAutoCompletePopulating);

And boom, it's set.

Programmin Tool
A: 

Do you have a working example of this?

Working on that for a blog post. But yeah I'll have one up tomorrow. It's actually not bad if you've used script controls before.
Programmin Tool