Load data table using dropdown select value

Question

I am trying to load a data-table using drop-down select value. But code not seems to be working. I am saving the drop-down value in hidden field on its on-change and redirecting but new_id is null. Below is my code.

HTML

    <input type="hidden" id="id_abc">
    <select id="abc" name="abc" class="form-control" onchange="xyz(this);">
    <option>-- Select --</option>
    </select>  

JS

    $(document).ready(function() {

         var new_id = $('#id_abc').val();

         if(new_id)
         {
            //GET DATA TABLE USING new_id

         }
    });

    function xyz(id)
    {
       $('#id_abc').val(id.value);
       //show the table
       var url =_PATH_+'?id='+id.value ;
       window.location = url; // redirect

    }

Any help would be appreciated. Thanks in advance.