Search code examples
javascriptgeocomplete

Submitting geocomplete form on suggestion select

I'm fairly new to JS so I'm a bit confused as in why this is not working. Basically I'm using the geocomplete jQuery plugin to populate a form with the coordinates and address. Then, once a user selects the destination, I want to sumbit the form.

 <form action="search.php" method="post" id="searchForm">
        <input id="geocomplete" type="text" placeholder="Where are you going to?" size="35" />
        <input name="lat" type="hidden" value="">
        <input name="lng" type="hidden" value="">
        <input name="formatted_address" type="hidden" value="" id="address">
    </form>

and this would be the scripts I call to initiate the form plugin (which works), and the script to submit the form once the value of the address has been changed by the plugin:

<script type="text/javascript">
window.onload= function () {
    if(window.addEventListener) {
        document.getElementById('address').addEventListener('change', doIt, false);
    } else if (window.attachEvent){
        document.getElementById('address').attachEvent("onchange", doIt);
    }

    function doIt(){
        document.getElementById("searchForm").submit();
    }
}

$("input").geocomplete({ details: "form" }); 


</script>

I don't see why this won't work since the value does get changed. Many thanks!

Solution

  • A change event fires only when the change occurs by direct user input, not when a script changes the input value.

    Use the events provided by that plugin as described on the page you already linked to.