By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,165 Members | 849 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,165 IT Pros & Developers. It's quick & easy.

Auto-Suggested Textbox like google auto suggest

P: n/a
I need to create a Auto suggests Textboox like in
http://www.google.com/webhp?complete=1&hl=en
I have completed this using AJAX.NET for Framework 1.1 . I have some design
issues after the data is populated.

For me the problem is I am getting more space after the item is selected.
And the items are displayed in a combo when i am going for another search /
selection without refreshing the page.
I am expecting a same output as google's auto suggested textbox.

see my work at http://www.reccustodian.com/Dropdown/Neworder.aspx

Please let me know if you get any on this.

The below is the javascript which helps to display the text box and the combo

//matches select
var matcheList = document.getElementById("matches");

//called by the onKeyUp javascript event on the input
function FindMatches(searchCriteria)
{
if (searchCriteria)
{
//SearchComplection is defined by Ajax.Net because that's the name of
the type we registered
NewOrder.FindMatches(searchCriteria, FindMatches_CallBack);
}
else
{
//clear the states dropdown
matcheList.style.visibility = "hidden";
}
}
//callback we told Ajax.Net to pass the response tos
function FindMatches_CallBack(response)
{
//if the server side code threw an exception
if (response.error != null)
{
alert(response.error); //we should probably do better than this
return;
}

//if we didn't get what we expect, or didn't get any matches
if (!response.value || response.value.length == 0)
{
matcheList.style.visibility = "hidden";
return;
}

matcheList.style.visibility = "visible";
matcheList.options.length = 0; //reset the states dropdown
matcheList.size = response.value.length; //dynamically set the size of
the select box
for (var i = 0; i < response.value.length; ++i)
{
matcheList.options[matcheList.options.length] = new
Option(response.value[i]);
}
}

//called when a match item is selected from the list
function MatchSelected(matches)
{
var state = document.getElementById("state");
var divDisp = document.getElementById("divList");
state.value = matches.options[matches.selectedIndex].text;
matcheList.style.visibility = "hidden";
//document.frmOrder.txtPClaimNo.focus();

matcheList.style.height="40px"

divDisp.style.visibility = "hidden";

selected = matcheList.options.selectedIndex;
value = state.value

if (selected !=0 || selected ==0)
{
count=3
for (var i = 0, oldpos = -1; i<count-1; i++)
{
pos = value.indexOf(',',oldpos+1);
data = value.substring(oldpos+1,pos);
frmOrder.elements['txtC' + i].value = value.substring(oldpos+1,pos);
oldpos = pos;
}
frmOrder.elements['txtC' + i].value =
value.substring(oldpos+1,value.length)
}
}

Thanks
Kumar

Apr 20 '06 #1
Share this question for a faster answer!
Share on Google+

This discussion thread is closed

Replies have been disabled for this discussion.