Trouble adding some javascript

**southshorepizza** · 15 Jul 2015, 02:22 PM

I am trying to add google address autocomplete to my site's create account page. I have the javascript code source getting pulled from the jquery_create_account.js file and using page source I can see it loading and have the autocomplete box displayed. However it is not populating anything when I start typing in an address using safari, chrome or firefox. All of the browsers show I am getting an "uncaught Reference error: google is not defined" How would I go about fixing this? At this point I have simply copied the api code into the javascript file and haven't made any changes to populate the correct fields so there are no errors outside of zen-cart. I tried it on another test form I created not the example one provided and it works perfectly so it's just not playing nicely with zen-cart.
You may see the error at https://onlineorder.sshorepizza.com/...ain_page=login

The google autocomplete field is is the third one down that says please don't use this section yet. (This isn't a public site.)

Thank you for your guidance.

**mc12345678** · 15 Jul 2015, 04:26 PM

Link didn't "copy" properly...

**southshorepizza** · 15 Jul 2015, 04:30 PM

moved a couple things around now the error is on autocomplete.setBounds view here.

**mc12345678** · 15 Jul 2015, 05:19 PM

FYI, reported that there is a certificate error... Don't know if google has made that part of their process and could be an issue, but thought worth mentioning possibly.

Couple of other things, looks like there are some other errors on the page that could/might affect the javascript from running. There are two instances of <body tags on the page. One at line 633 and the other at 818.

Got an undefined result when attempting to use the code contained within the if statement.

Seeing the duplicate body tag, perhaps the onload code should be moved up to where the body tag was first called.

What is currently line 633:

Code:

<body id="loginBody"onload="update_zone(document.create_account); update_zone_shipping(document.create_account);">

To be made to:

Code:

<body id="loginBody"onload="update_zone(document.create_account); update_zone_shipping(document.create_account); initialize();">

Might take a smidge to find exactly where to put that, but...

**mc12345678** · 15 Jul 2015, 07:47 PM

Yeah, actually I get it now, looks like your initialize function is never called... Not sure if there is some other javascript error, but probably should move the initialize function ahead of the other onload operations...

**southshorepizza** · 15 Jul 2015, 09:58 PM

thank you. I found it in includes/modules/pages/login/onload_login.js Between your help and Lat9 I have it working and am learning so much on how to do this. Thank you all but especially both of you for your willingness to help me learn!

**mc12345678** · 15 Jul 2015, 10:04 PM

Well the tough ones are the fun ones. :)

**southshorepizza** · 16 Jul 2015, 12:07 AM

I have everything working properly except for some reason I cannot place the zipcode or telephone into the respective elements. I am using

Code:

document.getElementById('postcode').value = zipcode;

and

Code:

document.getElementById('telephone').value = phone;

zipcode and phone are variables. I can see the zipcode variable in safari developer's show page resources screen. So it is populating. I have tried making var phone = "test"; to see if it is working. I can put these values in other element id locations such as id="firstname" or id="lastname" but not the id="postcode" or id="telephone".

Any ideas? here is the page again if you need it.

Thank you!

**lat9** · 16 Jul 2015, 02:21 PM

You've got another HTML error to resolve. The section that looks like:

Code:

   <fieldset class="fec-company">
    
    <legend>Please enter your address legend</legend>
    	<div id="locationField">
        <label class="inputLabel" for="google_address">Type address here for it to autofill everything but the zip code</label>
        <input id="autocomplete" placeholder="Enter your address" onFocus="geolocate()" type="text" required ></input>
        </div>
     </fieldset>

has an invalid input statement; the section should be coded as follows, self-closing the <input> tag:

Code:

    <fieldset class="fec-company">
    
    <legend>Please enter your address legend</legend>
    	<div id="locationField">
        <label class="inputLabel" for="google_address">Type address here for it to autofill everything but the zip code</label>
        <input id="autocomplete" placeholder="Enter your address" onFocus="geolocate()" type="text" required />
        </div>
     </fieldset>

**southshorepizza** · 16 Jul 2015, 02:43 PM

That's so funny you mention that because I was doing it the way you mentioned and my teacher last semester kept telling me that was wrong. I kept telling him it's how I see the code written. :)

Any ideas why I can't access the zip code or phone number elements with the id's of postcode and telephone?

Thank you

Thread: Trouble adding some javascript

Thread Tools

Search Thread

Display

Trouble adding some javascript

Re: Trouble adding some javascript

Re: Trouble adding some javascript

Re: Trouble adding some javascript

Re: Trouble adding some javascript

Re: Trouble adding some javascript

Re: Trouble adding some javascript

Re: Trouble adding some javascript

Re: Trouble adding some javascript

Re: Trouble adding some javascript

Similar Threads

javascript based navigation trouble

Newsletter help / Some javascript

Adding some javascript code

Where to add some javascript code?

Bookmarks

Bookmarks

Posting Permissions