Google maps autocomplete variables issue

Question

I have following code thas is being loaded across all pages ( all fuctions are included at once ). But inputs location1 and location2 exist only one of these pages. And is not affecting funcilonality, but each time I inspect javascript logs on the pages where these inputs do not exist I get error "InvalidValueError: not an instance of HTMLInputElement" (Firefox).

JavaScript:

     var autocomplete1 = new google.maps.places.Autocomplete($("#location1")[0], {});
            google.maps.event.addListener(autocomplete1, 'place_changed', function() {
                var place1 = autocomplete1.getPlace();
            });

     var autocomplete2 = new google.maps.places.Autocomplete($("#location2")[0], {});
            google.maps.event.addListener(autocomplete2, 'place_changed', function() {
                var place2 = autocomplete2.getPlace();
            });

and very basic form inputs (which a prefiled) on this spacific pagewhere console error doesnt show up:

HTML:

<input type="text" class="form-control" id="location1" name="location1" value="<?php echo"$location1"; ?>">
<input type="text" class="form-control" id="location2" name="location2" value="<?php echo"$location2"; ?>">

I wonder what I can do to avoid this error? Any advice

score 0 · Answer 1 · answered Sep 03 '16 at 00:41

0

yeah you can simply avoid it by testing on the currant page like this

var x = location.href // this will give you the absolute url of the page

    if(x=="the url of page where the input exist"){
       var autocomplete1 = new google.maps.places.Autocomplete($("#location1")[0], {});
                google.maps.event.addListener(autocomplete1, 'place_changed', function() {
                    var place1 = autocomplete1.getPlace();
                });
    }

so by this way the script will not enter that block until it validate that consition

answered Sep 03 '16 at 00:41

PacMan

1,358
2
12
25

ok, sory but i didn't mention that url is not absolute, as url is being generated based on records in mysql, example: test.php?edit=XXXX – Nita Sep 03 '16 at 00:49
you can always find an aproch to get the dynamic url from your php script see : [http://stackoverflow.com/questions/6768793/get-the-full-url-in-php] and then made a simple echo in your JS file to test on it – PacMan Sep 03 '16 at 00:54
thanks PacMan, i was hopping that there is some solution for this based more on inputs and their values rather then based on url (as these inputs might be used in more files in the future). – Nita Sep 03 '16 at 01:19
it may be possible but it will be kind of hard thing to achieve from scratch :) good luck with it – PacMan Sep 03 '16 at 01:33

score 0 · Accepted Answer · answered Sep 03 '16 at 01:37

Well I figure something out. But please comment if there is anyway to improve it.

var location1 = $("#location1").val();
if (location1 === undefined ){} else {
            var autocomplete1 = new google.maps.places.Autocomplete($("#location1")[0], {});
            google.maps.event.addListener(autocomplete1, 'place_changed', function() {
                var place1 = autocomplete1.getPlace();
            });
}

var location2 = $("#location2").val();
if (location2 === undefined ){} else {
            var autocomplete2 = new google.maps.places.Autocomplete($("#location2")[0], {});
            google.maps.event.addListener(autocomplete2, 'place_changed', function() {
                var place2 = autocomplete2.getPlace();
            });
}

Google maps autocomplete variables issue

2 Answers2