UPDATE 6/24/13:
Hello,
I have determined that the dropdown is working in Chrome after all, but Chrome's interpretation of the CSS styling is FUBAR. Here's my CSS for the autocomplete list itself. I'm using "!important" so much because the autocomplete extender has lots of inline styles that I can't track down:
.handlerAutoComplete { max-height: 150px; width: 180px !important; overflow: auto; position: relative !important; display:block !important; position: relative !important; visibility: visible !important; width: 161px; z-index: 1000 !important; left: 0px !important; top: 5px !important; }
Instead of making my autocomplete list appear relative to the textbox that called it, as it should, Chrome is making the list appear relative to the GridView in general, which means it gets shoved to the very bottom of the screen. Does know of a way to fix this?
ORIGINAL POST:
Hello,
I have an AutoCompleteExtender connected to an editable textbox, nested inside a GridView. In Firefox and IE, the code works as it should: the user types a few characters, and a list of suggestions appears. However, this does not happen in Chrome 27.
I created the AutoCompleteExtender following the directions given here: http://www.asp.net/ajaxlibrary/act_AutoComplete_Simple.ashx, and if I use the extender by itself (outside of a GridView) in Chrome, it works fine. Unfortunately, I need it to work within a GridView for this project, so if anyone has a solution, it would be much appreciated. My code is below. FYI, I am coding in C#, using Ajax Control Toolkit 4.1.7.429, in Visual Studio 2010 (if that last matters at all.)
In my markup:
<ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></ajaxToolkit:ToolkitScriptManager><asp:GridView ...><asp:TemplateField ...><ItemTemplate><asp:TextBox ID="dogHandlerEdit" runat="server"></asp:TextBox><ajaxToolkit:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" TargetControlID="dogHandlerEdit" ServiceMethod="GetCompletionList" UseContextKey="True" CompletionListCssClass="handlerAutoComplete"></ajaxToolkit:AutoCompleteExtender></ItemTemplate></asp:TemplateField></asp:GridView>
And then in my code-behind:
[System.Web.Services.WebMethodAttribute(), System.Web.Script.Services.ScriptMethodAttribute()] public static string[] GetCompletionList(string prefixText, int count, string contextKey) { List<string> lstList = new List<string>(); // Create data context DataContext dc = new DataContext( ... ); // Get dog info var people = (from p in dc.PPL_Peoples //where (p.PPL_FirstName.Contains(prefixText) == true || p.PPL_LastName.Contains(prefixText) == true) && p.PPL_Active == true where (p.PPL_FirstName.StartsWith(prefixText) == true || p.PPL_LastName.StartsWith(prefixText) == true) && p.PPL_Active == true orderby p.PPL_LastName ascending, p.PPL_FirstName ascending select new { p.PPL_FirstName, p.PPL_LastName }).Take(30); // Add names to the list foreach (var person in people) { lstList.Add(person.PPL_FirstName + " " + person.PPL_LastName); } return lstList.ToArray(); }
Thanks in advance for your help.