One thing I do notice with my code is that it is slow. If I change
provinces and type in the city field and change provinces again things
slow right down. I know this must be due to the way I have coded this.
I am wondering if you have any suggestion to improve the speed of
things? The form will primarily used by those in Alberta so I though
if I loaded the array with Alberta city names by default when the
script loads it might speed things up. DO you think the JSON approach
you mentioned would be quicker?
Thanks,
Mat
On Dec 6, 12:15 pm, Mat <[EMAIL PROTECTED]> wrote:
> Hi Micheal,
>
> Thank you so much for that. I knew I was getting close to a solution
> but I was well and truly stuck. It is now working and I am delighted.
>
> This is the code that worked for me
>
> success: function(xml) {
> towncity = [];
> $(xml).find("[EMAIL PROTECTED]'"+ currprov +"'] > TOWN_CITY_NAME").map
> (function(){
> towncity.push( $(this).text() );
> $("#city").autocomplete(towncity);
> });
>
> }
>
> The XML file I am querying is a file I constructed myself (so I have
> full access to it) for a few different reasons. I am not good enough
> at mySQL to create a database with the information, I am too cheap to
> pay for a ready made database ;), the autocomplete script gives an
> option of storing the data in a local.js file but I did not like this
> idea as it may not transfer to future projects and I don't really know
> much about JSON.
>
> Once again thank you so much, I expected to have to spend hours trying
> to get this to work today!
>
> Mat
>
> On Dec 5, 11:55 am, "Michael Geary" <[EMAIL PROTECTED]> wrote:
>
> > Hi Mat,
>
> > 1) You're defining towncity like this:
>
> > var towncity = window.towncity = new Array();
>
> > That creates both a local variable named towncity and a window property
> > (global variable) of the same name. Is that what you want? Do you need to
> > use towncity outside this code? If not, I would change it to:
>
> > var towncity = [];
>
> > 2) In the .each() inside your ajax callback you have this code:
>
> > towncity = $(this).text();
>
> > That *replaces* the towncity variable with the text of the single XML
> > element for the current iteration of .each() - so it's no longer an array
> > but is now a simple text string. It doesn't sound like that's what you want,
> > is it?
>
> > To append the item text to the towncity array, you could change it to:
>
> > towncity.push( $(this).text() );
>
> > But you probably also want to clear this array before running the loop (is
> > that right?), so just before the $(xml).find(...) you should add:
>
> > towncity = []; // note: no "var" here
>
> > which gives you this code:
>
> > success: function(xml) {
> > towncity = [];
> > $(xml).find(...).map(function(){
> > towncity.push( $(this).text() );
> > });
> > }
>
> > Given that, you could simplify the code to:
>
> > success: function(xml) {
> > towncity = $(xml).find(...).map(function(){
> > return $(this).text();
> > });
> > }
>
> > BTW, do you have control over the XML file that the server generates? If you
> > do, you could use JSON instead of XML to make the code simpler. If you're
> > stuck with XML, this code should do the trick.
>
> > -Mike
>
> > > From: Mat
>
> > > Hi there,
>
> > > I'm sorry this is a pretty newbie question....
>
> > > I am using JQuery with an xml file and autocomplete. What I am trying
> > > to achieve is to use an xml file as my data source to autocomplete
> > > cities in a form once a user selects their province. When a user
> > > selects a particular province then only the cities in that province
> > > will be listed by the autocomplete script as the user starts to type
> > > in the 'city' form field.
>
> > > My problem here is that I am trying to use the array 'towncity' as my
> > > data source for autocomplete and change the contents of the array when
> > > the province select box #province is changed. However, I can not get
> > > my $('#province').change(function().... to affect the array 'towncity'
> > > that I have declared outside of the function....
>
> > > <script type="text/javascript">
> > > $(document).ready(function() {
> > > var towncity = window.towncity = new Array();
> > > $("#city").autocomplete(towncity);
> > > $.preloadCssImages();
> > > $('div.jshide').show();
> > > $("#tenantForm").validate({
> > > rules: {
> > > name: {
> > > required: true,
> > > minlength: 2
> > > },
> > > province:"required",
> > > ccom:"required",
> > > occupied: "required",
> > > rented:"required",
> > > condo:"required",
> > > payment:"required"
>
> > > }
> > > });
>
> > > $("#renewdate").datepicker({
> > > dateFormat: "d M, yy",
> > > showOn: "both",
> > > buttonImage: "images/calendar.gif",
> > > buttonImageOnly: true
> > > });
>
> > > $('#province').change(function() {
> > > var currprov = $('option:selected',
> > > this).text();
>
> > > $(function() {
> > > $.ajax({
> > > type: "GET",
> > > url: "xml/location.xml",
> > > dataType: "xml",
> > > success: function(xml) {
>
> > > $(xml).find("[EMAIL PROTECTED]'"+ currprov +"'] >
> > > TOWN_CITY_NAME").each(function(){
>
> > > towncity = $(this).text();
> > > });
> > > }
> > > });
> > > });
> > > });
> > > });
> > > </script>
>
> > > Anyone have any ideas?
>
> > > Thanks,
> > > Mat
