|
|
 Prize winner in Competition
"Best ASP.NET article of Jul 2007"
Comments and Discussions
|
|
 |
|
I've got auto-suggest working perfectly. It's great. I can use multiple text fields without any problems, except when I put the field within a form.
This is test code that works for the built-in array and for server side auto-suggest. Works perfectly in both cases.
When I had this working, I'd thought that I would have no problems getting this into real code.
<html>
<head>
<link rel="stylesheet" type="text/css" href="autosuggest.css"></link>
<script type='text/javascript' src='autosuggest.js'></script>
<script>
var customarray = ["apple", "alligator", "banana", "elephant",
"pear", "kingbird", "kingbolt", "kingcraft",
"kingcup", "kingdom", "kingfisher" ];
</script>
</head>
<body>
<input type="text"
id="tb" value=""
style="font-family:verdana;width:300px;font-size:12px" />
<script>
var obj = new autosuggest("tb", customarray);
</script>
<input type="text" id="tb2" value="" style="font-family:verdana;width:300px;font-size:16px" />
<script>
var obj = new autosuggest("tb2", "", "http://127.0.0.1/autosuggest.wsgi/?field=npi&s=");
</script>
</body>
</html>
For whatever reason, auto-suggest is not reading in the strings from the fields when it's in a form.
<form id="subForm" name="subForm" method="post" onSubmit="return verifyForm(this);" action="http://127.0.0.1/retrieve.wsgi">
<div class="box">
<h2>Store information</h2>
<p>
<label class="label">NPI#</label><input type="text" name="npi" id="npi" />
<script type="text/javascript">
var obj = new autosuggest("npi", "", "http://127.0.0.1/autosuggest.wsgi/?field=npi&s=");
</script>
</p>
I've tried changed the ids passed to autocomplete but that didn't work. I followed the code using Firebug and I can see that the code isn't failing but it's not finding the text from the field.
On about line 35, I can see that the correct field id is being assigned.
function autosuggest(id, array, url, onSelect)
{
var field = document.getElementById(id);
The form actually contains about 15 fields. Rather than having the users guess what might data might actually be present in the database for that field, I'd like to present the most likely data first.
I'd greatly appreciate any assistance or guidance you can provide.
Thank you.
modified on Saturday, December 4, 2010 1:42 PM
|
|
|
|
|
Good morning Joanne,
I've just tested the script with the following page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title>Autosuggest control test page</title>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<!---->
<style type="text/css">
input
{
font-size: 12px;
font-family: verdana;
}
table
{
width: 100%;
text-align: center;
}
td
{
vertical-align: top;
}
</style>
<!---->
<link rel="stylesheet" type="text/css" href="styles/autosuggest.css"></link>
<script type="text/javascript" src="scripts/autosuggest.js"></script>
</head>
<body>
<form id="subForm" name="subForm" method="post" önSubmit="return verifyForm(this);" action="http://127.0.0.1/retrieve.wsgi">
<table>
<tr>
<td>
-->
<input type="text" id="target" size="40" value="" />
<script type="text/javascript"> new autosuggest("target", null, "http://localhost/Autosuggest/autosuggest.php?q="); </script>
</td>
</tr>
</table>
</form>
</body>
</html>
(I have Apache server on the "localhost")
- and everything worked great. Can you please check 2 things:
1. Does the page send the data? You can check if the request is made with TamperData extension for Firefox.
2. Please try to add the XHTML declaration. Not sure about this, though - for me everything worked without it.
If you wish - I can send you the whole testbed with PHP/MySQL code.
Even better - maybe any public page for me to test?
Best regards,
Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
How don't know how I stumbled upon this autocomplete="off" directive but I tried it and it worked! Now each field successfully works.
<form id="subForm" name="subForm" method="post" onSubmit="return verifyForm(this);" action="http://127.0.0.1/retrieve.wsgi" autocomplete="off">
Thank you.
|
|
|
|
|
Well, it seems that browser's history somehow interfered with the auto-completion.
I didn't notice it, because my privacy options are maxed out, so field history is not recorded.
Thank you for letting me know, anyway 
- Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
|
|
 General  News  Suggestion  Question  Bug  Answer  Joke  Rant  Admin
|
This article presents code that augments any INPUT box with an auto-suggest feature, AJAX-capable
| Type | Article |
| Licence | Zlib |
| First Posted | 24 Aug 2007 |
| Views | 370,881 |
| Downloads | 1,759 |
| Bookmarked | 197 times |
|
|
Submit an article or tip
Post your Blog
