zip code and city

[Bob Bedford]

I've a page where users may enter a zip code (text edit) and I want to fill
a combobox with existing cities depending on the zip code entered.

Let give an example.

I've my text edit like:
<input name="ZIP" type="text" id="ZIP" onKeyUp="fillcitycombo();">
<select name="City" id="City"></select>

When entering the zip code, I'd like the fillcitycombo() function to fill
the combobox with the matching cities.
For example I've

IDCity ZIP City
1 1950 Sion
2 1950 Pont-de-la-Morge
3 3960 Sierre
4 3960 Corin

So user's entry 3960 should fill the combo with Sierre, ID 3 and Corin, ID
4, as selecting 3 or 4 will change the city (that share the same ZIP code).

Of course the ZIP and city datas will be in the javascript source, as client
side there is no access to the DB. For info, in the client's DB I store the
IDCity code.

Thanks for help.

Bob

 

[kaeli]

I've a page where users may enter a zip code (text edit) and I want to fill
a combobox with existing cities depending on the zip code entered.

Does this help?

http://www.ipwebdesign.net/kaelisSpace/useful_dynamicSelects.html

--
--
~kaeli~
The man who fell into an upholstery machine is fully
recovered.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

 

[Bob Bedford]

Hi,

It's what I'm looking for, but I've to generate the list with 4430 records,
so I can't do it manually.

I've now an Excel file with those datas:
columnA : recordID
columnB : City
columnC : Zip code

How to work with such fields with your idea (sorry I'm not so confortable
with js).

Cheers

Bob

 

[kaeli]

Hi,

It's what I'm looking for, but I've to generate the list with 4430 records,
so I can't do it manually.

I've now an Excel file with those datas:
columnA : recordID
columnB : City
columnC : Zip code

How to work with such fields with your idea (sorry I'm not so confortable
with js).

You don't, more than likely.

The answer is highly dependent on environment.

If this is for an intranet/IE-only env, you can use ActiveX to read the file
and stuff.

If it isn't, you need to save the file as text on the server and use some
method of retrieving the values into the JS. Again, depends on env, but
you'll need a server-side script to either get the values and write into the
page before it's generated or one to do it after, similar to:
http://www.ipwebdesign.net/kaelisSpace/useful_serverClientValidation.html
Either way, there's a server-side scripting language involved.

Basically, standard internet cross-browser javascript cannot read files on
the server all by itself.

If this is a one-time only thing to generate hard-coded javascript based on
the Excel file on your HD, you could make a quick little Excel macro for
that. But I'm assuming the list changes and the JS is dynamic.

If this is to work only for you on your machine, you can use an HTA to read
the Excel.

See, it just all depends on what you're doing, exactly.

--

 

[Bob Bedford]

The answer is highly dependent on environment.

If this is for an intranet/IE-only env, you can use ActiveX to read the file
and stuff.

If it isn't, you need to save the file as text on the server and use some
method of retrieving the values into the JS. Again, depends on env, but
you'll need a server-side script to either get the values and write into the
page before it's generated or one to do it after, similar to:
http://www.ipwebdesign.net/kaelisSpace/useful_serverClientValidation.html
Either way, there's a server-side scripting language involved.

Basically, standard internet cross-browser javascript cannot read files on
the server all by itself.

If this is a one-time only thing to generate hard-coded javascript based on
the Excel file on your HD, you could make a quick little Excel macro for
that. But I'm assuming the list changes and the JS is dynamic.

If this is to work only for you on your machine, you can use an HTA to read
the Excel.

Hi Kaeli,

Thanks for your valuable help

1- the file doesn't change (ZIP codes and cities most likely never changes
;-)....)
2- I know the difference between server side and client side. Now I do open
a pop-up (wich have PHP server side code, that retrieves datas from a MySQL
table) and then using JS I fill the combobox with cities that match the ZIP
code.

problem is that some browser (mainly on MAC) don't let this to be done
correctly. Also anti-popup program don't let either do this. So I'm looking
for creating a JS script, wich will be included in the page sent to the
client (the browser) wich a structure giving the possibility to fill the
combo by selecting a ZIP code in a text field. In my coutry, the same ZIP
code may have many little town, so I've to take care at this problem.

So my problem is, depending on the ZIP code selected, fill the combo with
possible town or cities accordingly, and then, when I submit the form, save
the RecordID (that is an unique code for the town).
The structure of my table is:

columnA : recordID
columnB : City
columnC : Zip code

example:
1 Sion 1950
2 Chateauneuf 1950
3 Sierre 3960
4 Corin 3960
5 Monthey 4520
6 St-Maurice 4290

So, if a user enter 3960 in a text field, the JS script should fill the
combo with Sierre and Corin. By selecting Sierre, I've to submit the
RecordID 3 (that will be saved in the database), if the user selects Corin,
the RecordID would be 4

If you have any idea, please let me know.

Cheers,

Bob

 

[J. J. Cale]

I actually did some very similar. I needed to access a database via
javascript and I was in a hurry. You can put the database into a .js file.
The large amount of records makes it prohibitive to do manually. I wrote a
little c program to format the data something like this.
var numVariables=??; so I can use a loop efficiently
var varName1 = new Array('data','id','whatever'); // named and populated
programatically
or
var varName1 = new Array();
varName1.zipCode=????.
varName1.cityName="cityname";
etc
.....
var varNameN = .....
<script etc>
var ind =
document.yourForm["formName"].elements["selectName"].selectedIndex;
var myVar = eval("varName" + ind);
var myZipCode=myVar.zipCode
etc
</script>
This is not something you want to code manually and not a good long term
solution. But it will work!! >) Hope this helps.
Jimbo

 

[Dr John Stockton]

JRS: In article <[email protected]>, dated Tue,
14 Sep 2004 12:01:22, seen in Bob Bedford

I've a page where users may enter a zip code (text edit) and I want to fill
a combobox with existing cities depending on the zip code entered.

Let give an example.

I've my text edit like:
<input name="ZIP" type="text" id="ZIP" onKeyUp="fillcitycombo();">
<select name="City" id="City"></select>

When entering the zip code, I'd like the fillcitycombo() function to fill
the combobox with the matching cities.

For that, every user, including those of dial-up and other slow links,
will have to download the whole list. It may well not be a good idea.

 

[Robert]

Hi,

It's what I'm looking for, but I've to generate the list with 4430 records,
so I can't do it manually.

To get data, one possibility is to use a hidden iframe. What you do
is periodically load the iframe. Have the iframe invoke some
javascript in the onload handler. Have the javascript refresh the
page.

Here is a more detail write up:

http://groups.google.com/groups?hl=en&lr=&ie=UTF-8&[email protected]

From: Erwin Moller
Subject: Re: calling Perl script from javascript
Newsgroups: comp.lang.javascript

Another alternative is to use an xml HTTP request. See:

http://jibbering.com/2002/4/httprequest.html

I'd try to find a week long course on advanced web programming that
covers this stuff and convince your boss you need to attend.


Robert

 

[Bob Bedford]

To get data, one possibility is to use a hidden iframe. What you do

is periodically load the iframe. Have the iframe invoke some
javascript in the onload handler. Have the javascript refresh the
page.

Here is a more detail write up:

http://groups.google.com/groups?hl=en&lr=&ie=UTF-8&[email protected]

I've been using this method until some users sent me an email saying that it
doesn't work on their browser. Anti-popup program blocks open windows, so I
can't get the result back.

From: Erwin Moller
Subject: Re: calling Perl script from javascript
Newsgroups: comp.lang.javascript

Another alternative is to use an xml HTTP request. See:

http://jibbering.com/2002/4/httprequest.html

The reason I'm changing my code is that SAFARI isn't supported by some
features. and given what's written in the first part of the article, I won't
use this method.

Thanks anyway for the help.

 

[Jim Ley]

The reason I'm changing my code is that SAFARI isn't supported by some
features. and given what's written in the first part of the article, I won't
use this method.

That warning on Safari is somewhat more severe than I've now found (I
don't have a Max OS-X about so it's based on 3rd hand info) there are
limitations, it is more limited than the other 2 implementations, but
it's completely usable.

Jim.

 

[kaeli]

1- the file doesn't change (ZIP codes and cities most likely never changes
;-)....)

Then what you need is a one-time thing that just puts everything into a
javascript array for easy reading, then a script like this one, that makes
select options dependent on choices.
Note that dial-up users may begin to hate you.

http://www.ipwebdesign.net/kaelisSpace/useful_dynamicSelects.html

So, just query your DB and have the result incorporated into generated
javascript code. I'd do this with a quick Java or C program, but you could
use Perl or even PHP if that was all you know how to code. Anything that can
output the needed text. If you use PHP, just have it output plain text to the
screen and copy/paste that into your editor and save as .js file.

Pseudocode:
//query DB, select and group by, to get zips and cities
select City, IDCity, zip from myTable group by zip, City, IDCity

//Loop through results
init/declare zipArray to hold all zip codes
init/declare cityArray to hold cities by zip
for each zip do
put in zipArray
for each city in zip do
put in cityArray[zip]
done
done

Then you can output each array as javascript.
output zipArray as main array
for each element in cityArray do
output cityArray[zip]
done

2- I know the difference between server side and client side. Now I do open
a pop-up (wich have PHP server side code, that retrieves datas from a MySQL
table) and then using JS I fill the combobox with cities that match the ZIP
code.

problem is that some browser (mainly on MAC) don't let this to be done
correctly.

Well, I don't know if all browsers you need to support allow it, but you
*could* use an "invisible" iframe instead of a popup.


--

 

[Robert]

I've been using this method until some users sent me an email saying that it
doesn't work on their browser.

Iframe will only work on newer browsers. I should have mentioned that.

Anti-popup program blocks open windows, so I
can't get the result back.

I do not see a need for a popup. Why are you using a popup?

Put the iframe in a div at the bottom of your current page and hide the div.

I've only read about this stuff. I haven't tried it.

Robert

 

[Robert]

That warning on Safari is somewhat more severe than I've now found (I
don't have a Max OS-X about so it's based on 3rd hand info) there are
limitations, it is more limited than the other 2 implementations, but
it's completely usable.

Jim.

I'll test a page and report back here if that would be helpful. I
have Safari 1.0 which isn't the latest version however.

Robert