Tuesday, September 16, 2008

AutoCompleteExtender iframe problem

In AjaxToolKit there is an Extender that allows to set your textBox to work as auto complete control. it works just fine if you don't work with IE. IE has a problem, if you have a listbox under the list of autocompele suggestions , the suggestions will not be shown (they will be under the listbox), to fix this autocomplete extender has an iframe that should be bellow the suggestions list.
this should fix the IE bug, but to do that, you should add some manual code to you Extender, because if the width of the suggection list changes the if does not change his width or higth.
to fix this bug, add the following code.

1. add the event to your extender .
OnClientShown = "AutoComplereSearch_Show"

2. the AutoComplereSearch_Show
function AutoComplereSearch_Show(sender,args)
{
var oList = sender.get_completionList();
var oSpan= GetMainSpan(oList); // auto compelete is surrounded with 'span'.
var iframe = oSpan.getElementsByTagName('IFRAME')[0];
iframe.style.width = oList.style.width;
iframe.style.height = oList.offsetHeight;
}

function GetMainSpan(oObj)
{
var oParent = oObj.parentElement;
while (oParent.tagName!='SPAN')
{
oParent = oParent.parentElement;
}
return oParent;
}

No comments: