post textbox values in ajax request in php on change or textbox leave

Question

I have autocomplete address google api textbox in my form and when i select address i get the lat and long of selected address in another two textbox.

now when i select the addreess i want to pass the lat and long value in my ajax request also but every time i am getting null values.

please help me to go out of this.

<?php
echo $this->Form->input('from_address', array('required' => false,'label' => false, 'div' => false,
    'placeholder' => 'Enter from address', 'class' => 'form-control','id' => 'fromaddress'));
    ?>

     <?php echo $this->Form->input('from_lat', array('id' => 'fromlat'));  ?>
     <?php echo $this->Form->input('from_long', array('id' => 'fromlong'));  ?>

<script type="text/javascript">
$("#fromaddress").on('change', function() {   
    ajaxRequest = $.ajax({
    url: '<?php echo Router::url(array("controller" => "Orders", "action" => "searchCourier")); ?>',
        type: 'POST',
        data: {
            frmlat: $("#fromlat").val(),
            frmlong: $("#fromlong").val()
        },
       dataType: "html",
       success: function(response) {
            $("#courier_locations").html(response);
        },
        complete: function() {
            $('.spinicon').hide();
        }
    });
});

</script>

Answer 1

you can call your ajax on change of lattitude and langitude dropdown

$("#fromlat").on('change', function() {   
ajaxRequest = $.ajax({
url: '<?php echo Router::url(array("controller" => "Orders", "action" =>    "searchCourier")); ?>',
    type: 'POST',
    data: {
        frmlat: $("#fromlat").val(),
        frmlong: $("#fromlong").val()
    },
   dataType: "html",
   success: function(response) {
        $("#courier_locations").html(response);
    },
    complete: function() {
        $('.spinicon').hide();
    }
});

});