I’ve included javascript and HTML code, not full, but hopefully enough to give you idea. At the moment It works this way:
– If I click on input (id=zipcode), it shows prompt box in which you enter ZIP code.
I would like to know, if i can get rid of this prompt box and just do it this way:
– If I click on input (id=zipcode), it just shows a “bubble” with text above the input field “enter a zip code and the city/state will be pre-filled” … basicaly I would like to make autocompleter on the ZIP input field…
Javascript code:
function prefillLocale(zip)
{
var doc, City, State, ZipCode;
ZipCode = document.getElementById("ZipCode");
City = document.getElementById("City");
State = document.getElementById("State");
doc = ajax(doc);
// Load the result from the response page
// ** As far a I know firefox will only load a document on the SAME domain!!
if (doc)
{
var cmd = "../ajaxLocales.php?type=zip2cs&z=" + zip;
doc.open("GET", cmd, false);
doc.send(null);
var arraylist=doc.responseText.split("|");
City.value = arraylist[0];
State.value = arraylist[1];
ZipCode.value = zip;
}
return true;
}
var bDoneOnce = new Array();
function getZip1(ID
)
{
if(bDoneOnce[ID] != undefined) return;
bDoneOnce[ID] = 1;
var zip=prompt("Enter a zip code and the city/state will be pre-filled.","");
if (zip!=null && zip!="")
{
prefillLocale1(zip,ID);
}
document.getElementById("City"+ID).focus();
}
HTML code:
<div style="margin-left: 182px;">
<input type="text" onfocus="getZip1(50);" class="ac_input" value="Texas" id="State50" size="15" name="State">
<input type="text" onfocus="getZip1(50);" class="ac_input" value="75038" id="ZipCode50" size="5" maxlength="5" name="ZipCode">
</div>
http://www.jensbits.com/2010/05/29/using-jquery-autocomplete-to-populate-another-autocomplete-asp-net-coldfusion-and-php-examples/
http://www.jensbits.com/2010/05/29/using-jquery-autocomplete-to-populate-another-autocomplete-asp-net-coldfusion-and-php-examples/
I am unclear as to your full intentions, especially since your code makes very little sense. However, I was able to interpret some parts and point out some things “general practices” for use with jQuery. Below is the best interpretation of your code with jQuery specific changes, the biggest one being, you no longer need
ocument.getElementByIdas jQuery has replaced this with a simple$(insertElementIdOrClassNameOrCssSelectorHere). You will find jQuery makes almost everything in javascript…Easier!Your previous code: (gimmie feed back and I will attempt to help you fully fix the problem)