ListSearchExtender - Inside HTML Table - Prompt position is above table

I've seen forum questions regarding this issue from several months ago.

Has a solution been found?

I am putting al dropdownlist inside an html table using a listsearchextender.

I have not modified the css, so it is using the sample that comes with the toolkit.

When I click on the dropdownlist, the search prompt displays above the table.

I also added several additional dropdownlists with extenders and they all put the search prompt above the table

Is there a work around to get the search prompt to display directly above the position of the dropdownlist regardless of what row it on in a table ?

Thanks.

Hi,

I tried what you described on the sample web site, but can't reproduce the issue. Here is the code I used:

<table>
<tr>
<td>
</td>
<td style="width: 103px">
aa</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td style="width: 103px">
bb</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td style="width: 103px">
<asp:DropDownList ID="DropDownList1" runat="server" Width="100px" /></td>
<td>
</td>
</tr>
</table>
<br />
<p>
<ajaxToolkit:ListSearchExtender ID="ListSearchExtender2" runat="server"
TargetControlID="DropDownList1" PromptCssClass="ListSearchExtenderPrompt">
</ajaxToolkit:ListSearchExtender>
</p>

ListSearchExtender

I trying to implement this on a page and get the following java error.

AjaxControlToolkit.Resources.ListSearch_DefaultPrompt is null or not an object

this is the code

<cc1:listsearchextenderid="ListSearchExtender1"runat="server"targetcontrolid="ddlmylist"PromptText="Type to search"PromptCssClass="ListSearchExtenderPrompt"PromptPosition="Top"></cc1:listsearchextender>

any ideas?

I've not seen this one before -- could you try hitting Shift-Refresh to be sure that you are getting all the latest JavaScript scripts into the browser. If it still doesn't work could you try creating a new test web site and seeing if that also fails? If it does could you possibly zip it up and send it to me?

Thanks,

Damian (ListSearch contributor)

ListSearchExtender caused 2 postbacks instead of one

When I change selected item in DropDownList, then begins asynchronous postback and some UpdatePanels are reloading. I put one break point in the Page_load event. This break point activated once for each time when I changed selection in the DropDownList. So everything was ok.

 <asp:DropDownList ID="ddl_otdel" runat="server" AutoPostBack="True" DataTextField="otdel_name" DataValueField="id" OnDataBound="ddl_otdel_DataBound" OnSelectedIndexChanged="ddl_otdel_SelectedIndexChanged" />  <%-- <ajax:ListSearchExtender ID="listSearch_ddl_otdel" runat="server" TargetControlID="ddl_otdel" PromptCssClass="ListSearchExtenderPrompt" PromptText="Введите начало строки..." > </ajax:ListSearchExtender> --%>

After that I decided to use ListSearchExtender with my DropDownList. Since that moment my break point (in Page_load) began to activate twice for each time when I changed selection in the DropDownList. When I commented ListSearchExtender then everything became ok. Why there are 2 asynchronous postback instead of one?

May be my question isn't correct. Maybe I don't understand many things. But there is a problem that in some conditions ObjectDataSource executes SelectMethod when it's not necessary and page is going through server-cycle twice during one postback.

ListsearchExtender AutoPostback not firing

I have a Dropdown list control with autopostback = true. I am extending the control with the ListsearchExtender control. When I search the list and hit tab or enter the autopostback works as expected. But if I search the list and then click on the desired list item with the mouse it does not autopostback. I am using version 10920 of the toolkit.

Thanks.

Hi Jdclark,

We noticed that you had postanother thread before. If you have further questions, please feel free to discuss us in theorignal thread.

Best regards,

Jonathan

ListSearchExtender AutoPostback not firing

We have a few list boxes that do an auto post back. When I extend the controls with the ListSearchExtender, the search works, but i can only get the autopostback to fire if I scroll down and click what I want. If i type what i want till it is selected and then tab away, hit enter, or click that item, the autopoastback does not work.

The dropdowns are in a wizard control and the wizard is in an update panel if that makes a difference.

Is this expected behaviour or am I missing something?

Other than that this is a really good new tool in the toolkit.

Hi, I am having the same problem. Here is an example of my controls. The autopostback is not firing. Any help would be appreciated:

<asp:TableCell>
<asp:DropDownListID="ddlConsumer"AutoPostBack="True"CssClass="DropDownLists"runat="server" />
<asp:RequiredFieldValidatorID="valConsumer"ControlToValidate="ddlConsumer"ValidationGroup="Header"Text="*"runat="server"ErrorMessage="Consumer required"CssClass="ErrorMessages" />
<ajaxToolkit:ListSearchExtenderID="lseConsumer"TargetControlID="ddlConsumer"PromptPosition="Top"PromptCssClass="ListSearchExtenderPrompt"runat="server"/>
</asp:TableCell>

There is a workitem related to this issue -- please vote if you are affected by it:

http://www.codeplex.com/AtlasControlToolkit/WorkItem/View.aspx?WorkItemId=8744

I'm guessing you wouldn't want/expect the auto-postback to fire every time an item is selected as you do an incremental search ... I presume you'd want it to fire just when you tabbed away from the ListBox -- or perhaps when you hit enter?

Thanks,

Damian

Yes onBlur or when enter button is pressed.

Thanks, will vote.

I was affected by this as well, but I implemented the following workaround. I hope that this works for you guys:

Basically, I created a client side js method called RaisePostBack that asks for a control reference.
<script type="text/javascript">
<!--
// This function is called by the AJAX List Extender control. It's just an easy way to raise a post
// back event from the client-side. This is only needed because there are child controls that are
// dependent on the requester's selected data in order to retrieve the correct data
function RaisePostBack(Control)
{
// First we need to make sure that the postback event doesn't fire when the value is blank
if(Control.value != "")
{
// Call the postback event
__doPostBack("", "");
}
}
//--></script>

As you can see there is a method being called __doPostBack("", "") which does the magic needed to emulate AutoPostBack="True" on the control itself. I also added the initial check for the value because I'm calling this method onBlur of the control and do not want to have it executed if the user is just tabbing thru the controls. I would also recommend adding an isDirty method possibly.

Here is what I added to my dropdownlist controls:
<asp:DropDownList ID="FacilityDropDownList" runat="server" AutoPostBack="True"onBlur="RaisePostBack(this)" onChange="RaisePostBack(this)">
</asp:DropDownList>
<AjaxToolkit:ListSearchExtender ID="FacilityListSearchExtender" runat="server" TargetControlID="FacilityDropDownList" PromptText=" ">
</AjaxToolkit:ListSearchExtender>

Good luck and happy coding.

This link indicates the fix has been released with version10606 of the Ajax Control Toolkit. I downloaded and installed this, as well as version 10618, but the postback by the DropDownList is still not getting fired.

Am I missing something, is there still a problem, or what? Should I try one of the work-arounds posting in this thread?

Thanks so much for any assistance.

Dan

Hi Dan,

It fires when you leave the ListBox or hit Enter -- there is a method you can call to have it fire the OnChange as soon as a change is made.

Can you let me know if this is the behavior you are seeing?

Thanks,

Damian

I tried hitting enter and also leaving the field with the tab key. moving focus to another textbox on the page. The SelectedIndexChanged did not fire in either case.

Thanks.

Dan

Is it possible that the previous installation of the Ajax Control Toolkit is in play even though I installed the later version? Is there anything in the GAC, for example, that might be messing things up? Is it possible to uninstall before installing the later version?

Thanks.

Dan

An old version of the toolkit is the most likely explanation, however the toolkit isn't loaded into the GAC (the ASP.NET AJAX assemblies are though). Could you double-check the toolkit assembly reference in your solution to ensure that it is pointing to the new toolkit?

Thanks,

Damian

Thank you for the post. This code does work. However, when I implemented it on my page, the postback now makes the entire page refresh, overriding the updatepanel control, which is the original reason I started using Ajax in the first place, to make a client style web application.

Please don't take this as a criticism. I just wanted to post the results I had using this solution, possibly saving someone else a few minutes if they don't want this behavior.

That was the problem. My project was still using an older AjaxControlToolkit.dll. I replaced it w/ the version from 10618 and now it works fine.

Thanks for all your help.

Dan

This was my problem as well. I just downloaded Ajax from the asp.net website. The default download link points you to version 1.0.10301.0. Maybe I'm blind or dense, but I did not see any options for a newer version until I found the previous post. Perhaps if someone from asp.net is monitoring this forum, they could get that link updated to point to the most recent version. Just a thought.

ListsearchExtender AutoPostback not firing

I have a Dropdown list control with autopostback = true. I am extending the control with the ListsearchExtender control. When I search the list and hit tab or enter the autopostback works as expected. But if I search the list and then click on the desired list item with the mouse it does not autopostback. I am using version 10920 of the toolkit.

Thanks.

Hi Jdclark,

I have wrote a sample and it works on my machine. My version is V11119 which is the latest. But as far as I know, there is no such issue reported on Codeplex. So I suggest that you should remove all the unnecessary parts and have a test.

<asp:DropDownList ID="DropDownList1" runat="server" Width="100px" AutoPostBack="true" />
<ajaxToolkit:ListSearchExtender ID="ListSearchExtender2" runat="server"
TargetControlID="DropDownList1" PromptCssClass="ListSearchExtenderPrompt">
</ajaxToolkit:ListSearchExtender>

C#:

protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
ListBox1.DataSource = GetWordListText();
ListBox1.DataBind();
DropDownList1.DataSource = GetWordListText();
DropDownList1.DataBind();
}

If it doesn't work, please feel free to let me know with asimple repro.

Best regards,

Jonathan

Hi Jonathan,

Thanks for the response. I downloadded V1119 and created a simple page. But I still have the same problem.

If I type to search and hit enter it works.
If I change focus it works.
If I dont type to search and just use the mouse to select it works.
If I type to search and use the mouse to click on any item other than the one highlighted by the search it works.

But If I type to search and click on the one highlighted by the search it does not fire the postback until loosing focus.

I know the easiest thing to do is type and hit enter, but I know if I use this feature in my application, inevitably someone will try to click and then complain it doesn't work.

Here is my page code:

<body>
<form id="form1" runat="server">
<div>
<ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</ajaxToolkit:ToolkitScriptManager>
<asp:DropDownList ID="DropDownList1" runat="server" Width="100px" AutoPostBack="true">
</asp:DropDownList>
<ajaxToolkit:ListSearchExtender ID="ListSearchExtender1" TargetControlID="DropDownList1" runat="server">
</ajaxToolkit:ListSearchExtender>
</div>
</form>
</body>

Here is my code behind code:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not Page.IsPostBack Then
DropDownList1.Items.Add(New ListItem("Apple", "Apple"))
DropDownList1.Items.Add(New ListItem("Orange", "Orange"))
DropDownList1.Items.Add(New ListItem("Banana", "Banana"))
DropDownList1.Items.Add(New ListItem("Pear", "Pear"))
DropDownList1.Items.Add(New ListItem("Pinapple", "Pinapple"))
DropDownList1.Items.Add(New ListItem("Grapes", "Grapes"))
End If
End Sub

Thanks for your help.

Hi JdClark,

Yes, I have reproduced your issue on my machine now. However, I think it is a design pattern rather than an issue.When we type the search text , the DropDownExtender will change its selectedIndex. DropDownExtender won't postback when it select the orignal item. So that's why the page don't postback in your situation. To fix this, ListSearchExtender attach onblur event to the DropDownExtender and it will force the page postback. Here is the code snippet.

 _onBlur : function() { /// <summary> /// Handle the Select's blur event /// </summary> this._disposePopupBehavior(); // Remove the DIV showing the text typed so far var promptDiv = this._promptDiv; var element = this.get_element(); if(promptDiv) { this._promptDiv = null; element.parentNode.removeChild(promptDiv); } if(!this._raiseImmediateOnChange && this._focusIndex != element.selectedIndex) { this._raiseOnChange(element); } }

We cannot find a better way for your situation, so I suggest that you should post your issue as a suggestion toCodePlex so that our developers will evaluate

it seriously and take it into consideration when designing the future release of product.Thanks

Best regards,

Jonathan

Hi Jonathan,

Thank you very much for your answer. Pardon my ignorance, but how do I attach the above code to the onblur event of the Dropdown control?

Thank you.

Hi Jdclark,

It is already contained in the AJAX Control Toolkit's source code. Also the onblur event has been attached to the Extender yet.Based on my research , I was failed to find out a better acceptable formula unless we modify its source code.

Best regards,

Jonathan

ListSearchExtender and TAB

Hi

I am beginning to use the ListSearchExtender and it works but only if I press Enter or click with the mouse on selected item; when I the press the TAB and focus leaves the ListSearchExtender and goes to next control the ListSearchExtender returns to first item... must of the users uses the TAB to go to next field/control. How can the ListSearchExtender keep its selected value?

Any solutions?

Thanks!

/Staffan

to make the question a litte bit better; TAB functions well when I am NOT dropping down the dropdown i e it keeps selected value, but if I dropdown the dropdown and then types some valid characters and then press TAB it returns to first item?

Kind Regards

STaffan

Hi,

The item is remained selected when I press tab according to my test.

Please try this sample:

<%@. Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"> protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { DropDownList1.DataSource = this.GetWordListText(); DropDownList1.DataBind(); } //string script = ClientScript.GetPostBackEventReference(DropDownList1, ""); //DropDownList1.Attributes.Add("onblur", script); //DropDownList1.Attributes.Add("onchange", script); //Response.Write(DropDownList1.SelectedValue); } public string[] GetWordListText() { string[] tempWordListText = new string[] { "Alfa", "Alpha", "Bravo", "Charlie", "Delta", "Echo", "Foxtrot", "Golf", "Hotel", "India", "Juliett", "Juliet", "Kilo", "Lima", "Mike", "November", "Oscar", "Papa", "Quebec", "Romeo", "Sierra", "Tango", "Uniform", "Victor", "Whiskey", "X-ray", "Xray", "Yankee", "Zulu", "Zero", "Nadazero", "One", "Unaone", "Two", "Bissotwo", "Three", "Terrathree", "Four", "Kartefour", "Five", "Pantafive", "Six", "Soxisix", "Seven", "Setteseven", "Eight", "Oktoeight", "Nine", "Novenine" }; Array.Sort(tempWordListText); return tempWordListText; }</script><html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> </div> <asp:DropDownList ID="DropDownList1" runat="server"> </asp:DropDownList> <ajaxToolkit:ListSearchExtender PromptPosition="Top" ID="ListSearchExtender1" runat="server" TargetControlID="DropDownList1"> </ajaxToolkit:ListSearchExtender> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> </form></body></html>

Hope this helps. If it doesn't, please provide a simple page without relying on any specific DataBase or class.

Hi!

When I am using your code and:

1. Click the downarrow to "downdrop"
2. When I see the beginning of the list and I am typing for example charli and then direct press TAB on my keyboard the dropdown selects Alfa.

?

Best Regards!

Staffan

ListSearchExtender (with a CascadingDropdownExtender)

Hi,

I'm using the ListSeachExtender as was intended, on a dropdown looking up from the list and finding based on what I've typed. The problem I'm having is that the OnChange event is never firing so I'm not getting the desired result when in fact the selected item is changing. I'm using this in combination with the CascadingDropDown extender but because the OnChange isn't firing my second DDL is not being populated with the correct results. Is there some way I can fire the OnChange event to get the desired result?

Thanks,
Dan

It should be fired when the element is selected by the ListSearch behavior in the else block. Please open awork item to track this. Thanks!

// If nothing is found then stick with the current option

if(selectedIndex == -1) {

// Need this because firefox has aleady changed the current option based on the character typed

this._newIndex =this._originalIndex;

}else {// Otherwise move to the new option

element.selectedIndex = selectedIndex;

this._newIndex = selectedIndex;

}

I've added a work item: http://www.codeplex.com/AtlasControlToolkit/WorkItem/View.aspx?WorkItemId=8771

ListSearchExtender - prompt position problem

I started by adding one ListSearchExtender linked to a first DropDownList (SystemID) and everything was working fine, the prompt was appearing on top of my DropDownList. Then I added a second ListSearchExtender for a second DropDownList (Country) and now the prompt position appears way at the top of my table. I removed the fist ListSearchExtender and test with the second ListSearchExtender only and I still have my problem. Both ListSearchExtender are located in their own update panel with the DropDownList and ValidatorCalloutExtender.

Anyone has a suggestion on this one?

Thanks

Hi Freedom,

Did you set the TargetControlID of the two ListSearchExtenders to the same control? I made a sample by following your description but failed to reproduce your issue. So would you please provide a simple sample here?Thanks

Best regards,

Jonathan

Did you set the updatemode on th updatepanels to conditional. This will avoid all the panels from refreshing.

ListSearchExtender - possible to disable the Prompt text?

The ListSearchExtender is a great new control, and works really well, however the prompt text that accompanies is rather superfluous for my needs. Is there a way to disable it?

Not setting the Prompt properties doesnt work as that just defaults to showing the prompt, and setting the prompt text to "" still causes a slight area to be reserved for the text (and overlaps another of my controls). I just dont want any prompts at all...

Possible?

Just to say that I've also tried setting the CSS style of the Prompt to be "display:none", and also position: absolute, top: -500000px etc... but to no avail :(

It would be nice to use this control but I can't if its going to have this text displayed.

Hello there,

I'll see if I can find a way to disable it for you, but in any event I'll make sure that for the next release there is an option to disable it. This is something that came up in the code review as a suggestion, but I didn't have time to implement it before the release.

Regards,

Damian (ListSearch contributor).

Thanks Damian... and thanks for creating the ListSearch too!

If I set the promptCssClass to 'list_search_message' and define 'list_search_message' like this:

.list_search_message
{
display:none;
}

Then I don't see the prompt message ... could you let me now if you don't experience the same thing? I'm using IE7

dmehers:

If I set the promptCssClass to 'list_search_message' and define 'list_search_message' like this:

.list_search_message
{
display:none;
}

Then I don't see the prompt message ... could you let me now if you don't experience the same thing? I'm using IE7

Well dont I feel like a right idiot Worked a treat, thank you. No dea why it didnt work for me before. Obviously I made some kind of mistake!

Thank you...

ListSearchExtender Prompttext

Hi,

I'm using the ListSearchExtender in an intranet application. The application needs to be multilanguage, so I set the prompttext in the codebehind to a string in my resource files. But then, the application needs about 20 seconds for loading. Without setting the prompttext, it's done in 3 seconds.

I'm using this code:

ListSearchExtender1.PromptText = GetLocalResourceObject("LSEPromptText").ToString();

Has anyone an idea what to do?

Regards

Flo

why don't you set it in the aspx page by adding

meta:resourcekey="ListSearchExtender1Resource1"

to the list search extender's properties and then in the resource file add an entry key for

ListSearchExtender1Resource1.PromptText

then set the value to whatever you want it to be. That's what I did and it loads normally for all languages.

I have no idea why I didn't it that way. I used it in other applications... But thanks for the hint, it works.

ListSearchExtender prompt position

Would it be possible to add two new positions for the prompt: Left and Right? When using a DropdownList control inside of an HTML table the prompt cannot display correctly when positioned at the top of the control because it overwrites the list and it becomes unreadable. When inside of an HTML table it would be nice to be able to position the prompt either to the left or right of the control. Also, it would be good to have a prompt enable/disable feature because blanking the prompt text does not resolve the problem. I tried the workaround of setting the CSS class .list_search_method display:none; but that doesn't seem to work in some cases.

You could change the ListSearchExtender code easily to have it adapt to your scenario. Although, you shouldopen a work item to have us fix this.

You will need to add additional values to the ListSearchPromptPosition enum and modify the Behavior as well.

1 In the js file...
2
3 // Hook up a PopupBehavior to the promptDiv
4 this._popupBehavior = $create(AjaxControlToolkit.PopupBehavior, { parentElement : element }, {}, {},this._promptDiv);
5 if (this._promptPosition &&this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Bottom) {
6 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.BottomLeft);
7 }else if (this._promptPosition &&this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Top) {
8 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.TopLeft);
9 }else {
10 this._popupBehavior.set_x(getLeftOffset());// compute those offset values based on whether left or right was passed for the prompt position
11 this._popupBehavior.set_y(getTopOffset());// see popup control behavior on how it does that
12 }

Modify theenum...1516AjaxControlToolkit.ListSearchPromptPosition.prototype = {17 Top: 0,18 Bottom: 1,19 Left: 2,20 Right: 321}22AjaxControlToolkit.ListSearchPromptPosition.registerEnum('AjaxControlToolkit.ListSearchPromptPosition');In the cs file...26public enum ListSearchPromptPosition27 {28 Top = 0,29 Bottom=1,30 Left=2,31 Right=3,3233 }34

would you be able to advise your HTML that isn't working? Simply doing this:

 <table style="border: 2px solid black;"> <tr> <td><asp:ListBox ID="ListBox1" runat="server" Width="100px" /></td> </tr> </table> <ajaxToolkit:ListSearchExtender ID="ListSearchExtender1" runat="server" TargetControlID="ListBox1" PromptCssClass="ListSearchExtenderPrompt"> </ajaxToolkit:ListSearchExtender> works fine.

well, what it is overwriting is the top of the table and the border.

Basically to work around this, the behavior would have to create a span located above the textbox in its parent container.

I don't see that it overwrites the text of the list itself, though.

Thanks for the suggestion. I experimented a bit more based on your suggestion and found that by adding a row on top of the ListBox row allows the prompt to be displayed without clobbering anything around it. But if you need to place some text above the ListBox, then this workaround is not the best.

<table style="border: 2px solid black;">

<tr><td> </td></tr>

<tr>
<td><asp:ListBox ID="ListBox1" runat="server" Width="100px" /></td>
</tr>
</table>
<ajaxToolkit:ListSearchExtender ID="ListSearchExtender1" runat="server"
TargetControlID="ListBox1" PromptCssClass="ListSearchExtenderPrompt">
</ajaxToolkit:ListSearchExtender>

Thanks, I will open a work request as suggested. I had started to play with the source code last week and figured out the enum and prototype additions for Left and Right. I tried also to add code to check for ListSearchPromptPosition.Left and ListSearchPromptPosition.Right and was hoping that AjaxControlToolkit.PositioningMode.Left and AjaxControlToolkit.PositionMode.Right was already supported. I gave up at that point.

Here is what I tried to do:

3 // Hook up a PopupBehavior to the promptDiv
4 this._popupBehavior = $create(AjaxControlToolkit.PopupBehavior, { parentElement : element }, {}, {}, this._promptDiv);
5 if (this._promptPosition && this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Bottom) {
6 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.BottomLeft);
7 } else if (this._promptPosition && this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Top) {
8 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.TopLeft);
7 } else if (this._promptPosition && this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Left) {
8 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.Left);
7 } else if (this._promptPosition && this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Right) {
8 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.Right);
9 }

If I have time I will try to work out the code as suggested.

thanks!

Hi,

Was there ever a work item opened for this? Ability to position the prompt text more precisely would be helpful. Also, sometimes the dropdown opens down and sometimes it opens up. Then the prompt is covered up. Making the prompt position dynamic would be even better.

ListSearchExtender it seems that onchange event is not fired on DropDown

I'm using ListSearchExtender and seems that onchange is not fired when you type in DropDown. Is it a known bug? Is there any work around?

This is a known issue and we are planning to fix it. You could work around it by changing the code to fire the event in _searchForTypedText after the selected index has been set. Thanks.
Thanks. I'll just wait for fix. Is new version of Ajax Toolkit coming in the beging of april?

Personally, I'd rather put it in _onKeyPress, like this:

if

(e.charCode == Sys.UI.Key.enter || e.charCode == Sys.UI.Key.tab) {

element.onchange(

this);

}

Or _onBlur

Sorry... better yet.

In _onBlur after removing the prompt div, you can use this:

if

(this._originalIndex !=this._newIndex) {

element.onchange(this);

}

My way to fire the onChange is to call the same javascripts function in bothonChange andonKeyUp:

<asp:ListBoxid="ListBox1"runat="server"onChange="DoSomething(this)"onKeyUp="DoSomething(this)"></asp:ListBox>

<cc1:listsearchextenderid="ListSearchExtender1"runat="server"TargetControlID="ListBox1"PromptCssClass="listSearch"></cc1:listsearchextender>

The list box extender now fires the change event and you should not need to workaround this anymore. Please download the latest version of the Toolkit which contains this fix.

ListSearchExtender error - System.InvalidOperationException: Extender controls may not be

I created a custom web control (ListSearchControl) using the ListBox and ListSearchExtender control. I added this control to another custom control which is dynamically added to a page. The page ahs a ScriptManager tag before any other controls and inside Form tag. The control works fine on page laod, but gives an error on post back - "System.InvalidOperationException: Extender controls may not be registered after PreRender".

I tried using the same custom control((ListSearchControl) adding it to the page directly and it works fine even on postback.

Is there any way to get out of the error in the first case, or is there a known problem with using Control toolkit extenders being added dynamically on the page?

Hi,

Please try the workaround in this thread : http://forums.asp.net/t/1160803.aspx

Nai-Dong Jin - MSFT:

Hi,

From your description, it seems that while you are usingASP.NET AJAX Toolkit with your controls, you'll get a message whichsays "Extender controls may not be registered after PreRender", right?

For this kind of issue, one workaround is to call the baseOnPreRender method before declaring your controls while overriding theOnPreRender method on the page where you had the new extender control.See the following code snippet:

protected override void OnPreRender(EventArgs e)
{
// add base.OnPreRender(e); at the beginning of the method.
base.OnPreRender(e);
// codes to handle with your controls.
...

}

Also, there's a good sample on how to create an ASP.NET AJAX Toolkit Extender Control to Extend an standard control. See,
http://weblogs.asp.net/dwahlin/archive/2007/08/08/creating-an-asp-net-ajax-toolkit-extender-control.aspx

ListSearchExtender could work much better with slight enhancement

The List Search Extender is definitely very useful but a slight enhancement could make it a lot better. I use a javascript implementation of this type of functionality in my code which can be seen at:

http://www.codeproject.com/useritems/selectasyoutype.asp

The key difference is the following. Say as an example you have a long list of names in a listbox e.g. list of countries. You start typing 'i' 't' 'a' for Italy. Now you can change your mind and actually want to go for Spain so you next type in a 's' and then 'p' etc. Where the Select As You Type script differs is that when it doesn't find any matches for 'i' 't' 'a' 's' 'p', it starts again at the point where you started a new search. So instead of the listbox looking for 'itasp', it actually realises that it should now be looking for countries starting with 'sp'. Could you guys possibly implement that as it is far better than having to erase each of the characters to start the listbox search again.

Regards

Harel

This is an interesting idea -- I've created a work item for it. If anyone else would like this functionality then please vote for it:http://www.codeplex.com/AtlasControlToolkit/WorkItem/View.aspx?WorkItemId=8763

Regards,

Damian

There would need to be some type of timeout attached to the control so if a user stopped typing for X seconds and started again, the control would realize that a new sequence of characters was being typed. Explorer.exe contains that functionality, of course.

I definitely vote yes for it.

ListSearchExtender causing Sys.InvalidOperationException

Hello all,

I am having an issue with ListSearchExtender. I have the ListSearchExtender inside of an Panel, which is inside of an UpdatPanel. There is a CheckBox on the form, that when clicks, causes the Panel to become visible. When I select the CheckBox, the Panel shows up just fine an everything works. When I do anything that causes a postback after this is done, I get the following javascript error:

Sys.InvalidOperationException: Handler was not added through the Sys.UI.DomEvent.addHandler method.

I know the problem is coming from the ListSearchExtender because when I take it out, I do not get this error. Below is the UpdatePanel that contains the ListSearchExtender. Any help would be greatly appreciated.

Thanks,

Nick

<aspajax:UpdatePanel ID="upPharmacist" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID="pnPharmacist" runat="server" Width="100%" Visible="false">
<table style="width: 100%;">
<tr>
<td align="left" colspan="2" bgcolor="#eeeeee">
Pharmacist Information</td>
</tr>
<tr>
<td class="wizardLeftColumn">
Address 1:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbAddress1" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td class="wizardLeftColumn">
Address 2:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbAddress2" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td class="wizardLeftColumn">
State:
</td>
<td class="wizardRightColumn">
<asp:DropDownList ID="ddState" runat="server">
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
Zip:
</td>
<td class="wizardRightColumn">
<asp:DropDownList ID="ddZip" runat="server">
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
City:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbCity" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
Phone 1:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbPhone1" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
Phone 2:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbPhone2" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
Fax:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbFax" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
Provider Type:</td>
<td class="wizardRightColumn">
<asp:DropDownList ID="ddProviderTypes" runat="server" DataSourceID="odsProviderTypes"
DataTextField="TypeDescription" DataValueField="TypeCode">
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
Medicaid Provider Id:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbMedicaidId" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
County:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbCounty" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
DUR Region:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbDURRegion" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
License Number:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbLicenseNumber" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
License State:</td>
<td class="wizardRightColumn">
<asp:DropDownList ID="ddLicenseState" runat="server">
</asp:DropDownList>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
NPI:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbNPI" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td class="wizardLeftColumn">
EIN/SSN:</td>
<td class="wizardRightColumn">
<asp:TextBox ID="tbSSN" runat="server"></asp:TextBox>
</td>
</tr>
</table>
</asp:Panel>
<ajaxToolkit:CascadingDropDown ID="cddState" runat="server" TargetControlID="ddState"
Category="State" PromptText="Please select..." LoadingText="[Loading codes...]"
ServiceMethod="GetStates" ServicePath="Services/AjaxAccessService.asmx">
</ajaxToolkit:CascadingDropDown>
<ajaxToolkit:CascadingDropDown ID="cddZip" runat="server" TargetControlID="ddZip"
Category="Zip" PromptText="Please select..." LoadingText="[Loading codes...]"
ServiceMethod="GetZipCodes" ServicePath="Services/AjaxAccessService.asmx" ParentControlID="ddState">
</ajaxToolkit:CascadingDropDown>
<ajaxToolkit:ListSearchExtender ID="lseZip" runat="server" TargetControlID="ddZip"
PromptPosition="Bottom" BehaviorID="lseZip">
</ajaxToolkit:ListSearchExtender>
<ajaxToolkit:CascadingDropDown ID="ccdLicenseState" runat="server" TargetControlID="ddLicenseState"
Category="State" PromptText="Please select..." LoadingText="[Loading codes...]"
ServiceMethod="GetStates" ServicePath="Services/AjaxAccessService.asmx">
</ajaxToolkit:CascadingDropDown>
</ContentTemplate>
</aspajax:UpdatePanel>

Has no one else run into this problem? I was really hoping to use the ListSearchExtender in this manner.

Thanks,

Nick

ListSearchExtender causing postback twice

I was wondering if anyone else has noticed this. When a DropDownList control is extended with ListSearchExtender, and the DropDownList has the AutoPostBack property set to true, the page loads twice. If you step through the debugger you will see OnInit, OnPrerender, Page_Load, etc. being called twice.

Does anyone have a workaround to prevent this?

Thanks,

Carl

Hi Carl,

I'll try to reproduce this to see if I can work out what is going on. Do you have a simple page with just a DropDownList and the extender on it? (No UpdatePanels etc).

Thanks,

Damian

Weeeeell...

This is intereesting. ListSearch only causes double postback when a breakpoint is set. I put together the following code. If you set a breakpoint anywhere in the code-behind, clicking the ListSearch-enabled DropDownList will post back twice. But if you do not have a breakpoint, it posts back once. It still is behavior that doesn't occur without the ListSearch, but at least it isn't REALLY posting twice. Any idea why this is occurring?

Thanks,

Carl

.aspx code:

<%@.PageAutoEventWireup="true"CodeFile="MaskedEditTest.aspx.cs"

Culture="auto"Inherits="MaskedEditTest"

Language="C#"Title="MaskedEdit/ListSearch Example"

UICulture="auto" %>

<%@.RegisterAssembly="AjaxControlToolkit"

Namespace="AjaxControlToolkit"TagPrefix="ajaxToolkit" %>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headid="Head1"runat="server">

<title>Untitled Page</title>

</head>

<body>

<formid="form1"runat="server">

<div>

<ajaxToolkit:ToolkitScriptManagerrunat="server"

ID="ScriptManager1"EnableScriptGlobalization="true"

EnableScriptLocalization="true"/>

DropDownList without ListSearch. Click on

a selection.

<asp:DropDownListID="DropDownList1"runat="server"

AutoPostBack="true">

<asp:ListItemText="select one"></asp:ListItem>

<asp:ListItemText="hello"></asp:ListItem>

<asp:ListItemText="goodbye"></asp:ListItem>

</asp:DropDownList>

<br/>

<br/>

<asp:LabelID="Label1"runat="server"Text="Postback count: "></asp:Label>

<asp:LabelID="Label2"runat="server"Text="0"></asp:Label>

<br/>

<br/>

DropDownList with ListSearch. Click on a

selection.

<asp:DropDownListID="DropDownList2"runat="server"

AutoPostBack="true">

<asp:ListItemText="hello"></asp:ListItem>

<asp:ListItemText="goodbye"></asp:ListItem>

</asp:DropDownList>

<ajaxToolkit:ListSearchExtenderID="ListSearchExtender1"

runat="server"PromptPosition="top"PromptText="Type to search"

TargetControlID="DropDownList2">

</ajaxToolkit:ListSearchExtender>

<asp:TextBoxID="TextBox1"runat="server"

/>

<asp:ImageButtonID="ImgBntCalc"runat="server"

ImageUrl="~/images/Calendar_scheduleHS.png"

CausesValidation="False"/>

<ajaxToolkit:MaskedEditExtenderID="MaskedEditExtender1"

runat="server"TargetControlID="TextBox1"

Mask="99/99/9999"MessageValidatorTip="true"

CultureName="en-US"

MaskType="Date"

DisplayMoney="Left"AcceptNegative="Left"

ErrorTooltipEnabled="True"/>

<ajaxToolkit:MaskedEditValidatorID="MaskedEditValidator1"

runat="server"ControlExtender="MaskedEditExtender1"

ControlToValidate="TextBox1"EmptyValueMessage="Date is required"

InvalidValueMessage="Date is invalid"Display="Dynamic"

TooltipMessage="Input a date"EmptyValueBlurredText="*"

InvalidValueBlurredMessage="*"ValidationGroup="MKE"/>

<ajaxToolkit:CalendarExtenderID="CalendarExtender1"

runat="server"Format="MM/dd/yyyy"TargetControlID="TextBox1"

PopupButtonID="ImgBntCalc"/>

<br/>

<asp:Buttonrunat="server"ID="resetButton"Text="Reset count"OnClick="resetButton_OnClick"/>

</div>

</form>

</body>

</html>

.cs code:

using System;

using System.Data;

using System.Configuration;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

///<summary>

/// Summary description for MaskedEdit

///</summary>

publicpartialclassMaskedEditTest :Page

{

privatestaticint dropDownListPostCount = 0;protectedoverridevoid OnPreInit(EventArgs e)

{

base.OnPreInit(e);

}

protectedoverridevoid OnInit(EventArgs e)

{

base.OnInit(e);

}

protectedoverridevoid OnLoad(EventArgs e)

{

base.OnLoad(e);

}

protectedoverridevoid OnPreRender(EventArgs e)

{

base.OnPreRender(e);

if (this.IsPostBack)

{

dropDownListPostCount++;

Label2.Text = dropDownListPostCount.ToString();

}

}

protectedvoid resetButton_OnClick(object sender,EventArgs e)

{

dropDownListPostCount = -1;

}

}

More importantly is the problem of ListSearchExtender not working with CascadingDropDownExtender. This one is easy to see. Just attach both extenders to a DropDownList (like the one in the sample web site) and when you close the form or click on another page, it throws a javascript null exception. I have documented this at CodePlex as ID# 8887.

Thanks,

Carl

Hi Carl,

I'm guessing that you are seeing multiple postbacks because the SELECT is losing focus several times as the debugger takes focus away, and gives it back -- the extender fires the OnChange when the SELECT loses focus.

With regards to the error with the CascadingDropDownExtender, I have not managed to reproduce this -- I added ListSearchExtenders to each of the lists on the CascadingDropDown example in the toolkit and had no issues -- could you perhaps post a small example where you are getting an error?

Thanks,

Damian

Hi, Damian. Sorry for the delay in getting back to you.

If you download the "How do I?" demo for CascadingDropDown found athttp://www.asp.net/learn/videos/view.aspx?tabid=63&id=77 and add ListSearch to it, you will see the problem. (You will have to update the AjaxToolkit.dll, since that how-to was written prior to ListSearchExtender.) If you add the following lines to Default.aspx between the opening form tag and the opening table tag that contains the 3 dropdownlists, you will see what I mean:

<ajaxToolkit:ListSearchExtender ID="ListSearchExtender1"
runat="server" TargetControlID="DropDownList1">
</ajaxToolkit:ListSearchExtender>
<ajaxToolkit:ListSearchExtender ID="ListSearchExtender2"
runat="server" TargetControlID="DropDownList2">
</ajaxToolkit:ListSearchExtender>
<ajaxToolkit:ListSearchExtender ID="ListSearchExtender3"
runat="server" TargetControlID="DropDownList3">
</ajaxToolkit:ListSearchExtender>

It will run fine, but when you close the page, or try to go to a different URL, you will get the following message:

Sys.InvalidOperationException: Handler was not added through the Sys.UI.DomEvent.addHandler method.

I would really like to use these two extenders together. Could you look into this?

Thanks,

Carl

I was able to get ListSearch and CascadingDropDown to work together by removing this line:

$clearHandlers(this.get_element());

from the dispose function in ListSearchBehavior.js. I tried replacing it with this code:

var element =this.get_element();

$removeHandler(element,'focus',this._onFocus);

$removeHandler(element,'blur',this._onBlur);

$removeHandler(element,'keydown',this._onKeyDown);

$removeHandler(element,'keyup',this._onKeyUp);

$removeHandler(element,'keypress',this._onKeyPress);

but it still failed.

What are the consequences of removing this call? I assume it would be a memory leak, but is it a leak on the user's machine that goes away when they navigate to a new page, or when they close the browser? Does it increase with each postback? Does it affect the server? Do the $removeHandler() functions in CascadingDropDownBehavior.js take care of this on behalf of ListSearchExtender (which I assume has something to do with the failure)? etc...

Thanks,

Carl

anyone?

I'll be looking into this in the next day or so and will do my best to get a fix into the next toolkit release.

Regards,

Damian

Great!

Thanks, Damian.

I'm about to check in a change to fix this. If you'd like to apply the fix locally to try it out before the next release that would be great.

I've declared a load of member variables:

this._focusHandler =null;

this._blurHandler =null;

this._keyDownHandler =null;

this._keyUpHandler =null;

this._keyPressHandler =null;

I replaced the "AddHandlers" in the "Initialize" with:

this._focusHandler = Function.createDelegate(this,this._onFocus);

this._blurHandler = Function.createDelegate(this,this._onBlur);

this._keyDownHandler = Function.createDelegate(this,this._onKeyDown);

this._keyUpHandler = Function.createDelegate(this,this._onKeyUp);

this._keyPressHandler = Function.createDelegate(this,this._onKeyPress);

$addHandler(element,"focus",this._focusHandler);

$addHandler(element,"blur",this._blurHandler);

$addHandler(element,"keydown",this._keyDownHandler);

$addHandler(element,"keyup",this._keyUpHandler);

$addHandler(element,"keypress",this._keyPressHandler);

In the 'dispose' I replaced the 'clearHandlers' with:

var element =this.get_element();

$removeHandler(element,"focus",this._focusHandler);

$removeHandler(element,"blur",this._blurHandler);

$removeHandler(element,"keydown",this._keyDownHandler);

$removeHandler(element,"keyup",this._keyUpHandler);

$removeHandler(element,"keypress",this._keyPressHandler);

Regards,

Damian

Cool! Thanks, Damian. I'll give it a try and let you know how it goes.

Thanks,

Carl

ListSearchExtender with TextBox

Hi!

I'm trying the ListBoxExtender and it works perfectly, but I have one question... I'd like to use a TextBox to insert the characters and see the prompt... it's posible?

Thanks

Sorry for my english, as you can see it isn't very good...

Are you talking about ListSearchExtender ? I am not sure about ListBoxExtender control.

Sorry, I'm talking aboutListSearchExtender... a little confusion...

There is no straight forward way to do this. I mean, there is no option in the control to do this. You need to tweak the code to manage this issue. Let me know if you need any help in tweaking the code in finding out what needs to modified to get this done.
Has anyone looked into this? I'm looking at the source code, but I'm not sure what to change ... and I know VB.net not C#.

ListSearchExtender Question

My users have a listbox that I am using the listsearchextender to help them, however if a value is not found in the list what ever the last item similer

is left in the list box.

is there a way to say change the color to red if they start typing some thing not found in the list?

Hi,

This isn't a build-in feature. If you really need this, you may have to modify its source code.

Please investigate the _searchForTypedText method in ListSearchBehavior.js file and add necessary codes.