map save latitude and longitutde

_form.html.erb

<link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" rel="Stylesheet"></link>
<script src='https://cdn.rawgit.com/pguso/jquery-plugin-circliful/master/js/jquery.circliful.min.js'></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js" ></script>



<script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyAvuPSxdugPS2FJQibo-i78wVZHWgmKemk&libraries=places"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/geocomplete/1.7.0/jquery.geocomplete.js"></script>


<script type="text/javascript">
$("#autocomplete").geocomplete()
          .bind("geocode:result", function(event, result){
            b = result
            a = result.address_components
            for ( var i = 0, l = a.length; i < l; i++ ) {
                if (a[i].types.indexOf('administrative_area_level_2') > -1)
                {
                  $('#locality').val(a[i].long_name)
                }
                if (a[i].types.indexOf("country") > -1)
                {
                  $('#address_line').val(a[i].long_name)
                }
                if (a[i].types.indexOf("postal_code") > -1)
                {
                  $('#zipcode').val(a[i].long_name)
                }
                if (a[i].types.indexOf('administrative_area_level_1') > -1)
                {
                  $('#state').val(a[i].long_name)
                }
            }

            console.log("Data", result);
            // $("#state").val(a[3].long_name)
            $("#location_latitude").val(result.geometry.viewport.na.j)
            $("#location_longitude").val(result.geometry.viewport.ga.l)


          });