Как получить значение из значения параметра тега select html, используя событие onChange, используя таблицу данных jQuery?

Question

Я работаю над таблицей данных jQuery для загрузки нескольких данных из базы данных mysql.

Вот HTML код:

<table id="employee-grid" cellpadding="0" cellspacing="0" border="0" class="display" width="100%"> 
    <thead> 
     <tr> 
      <th>#</th> 
      <th>User Id</th> 
      <th>Address</th> 
      <th>Package Name</th> 
      <th>Status</th> 
      <th>Action</th> 
     </tr> 
    </thead> 
</table> 

От PHP страницы я загружаю данные как ниже:

// skipping more code... 

$nestedData[] = " 
<select class='form-control changeStatus' name='status'> 
    <option value=''>--Select--</option> 
    <option value='1|$client_id' $statusMsg1>Active</option> 
    <option value='2|$client_id' $statusMsg2>Blocked</option> 
</select>"; 

Теперь загружены данные выглядят следующим образом:

Теперь я хочу позвонить в запрос Ajax, когда значение html selected изменено. Он вызывает Ajax запрос успешно, указав код.

JQuery код JQuery таблица данных и My Ajax запрос:

$(document).ready(function() { 

    var dataTable = $('#employee-grid').DataTable({ 
     "processing": true, 
     "serverSide": true, 
     "ajax":{ 
      url :"server_processing.php", // json datasource 
      type: "post", // method , by default get 
      error: function(){ // error handling 
       $(".employee-grid-error").html(""); 
       $("#employee-grid").append('<tbody class="employee-grid-error"><tr><th colspan="3">No data found in the server</th></tr></tbody>'); 
       $("#employee-grid_processing").css("display","none"); 

      } 
     } 
    }); 

    $("#employee-grid").on('change', function() { 
     var status = $('.changeStatus').val(); 
     alert(status); 
     $.ajax({ 
      url : "<?php echo SITE_URL . 'toplevel/update-data'; ?>", 
      data : { 
       'statusChange' : status 
      }, 
      type : 'POST', 
     }); 
    }); 

}); 

, но когда я выбираю опцию, то каждый раз, когда это проходящего первого значения параметра

Для например, Это selected вариант тег имеет эти значения:

<option value='1|11' $statusMsg1>Active</option> 
<option value='2|11' $statusMsg2>Blocked</option> 

Это всегда проходит 1|11 значение !! Это должно пройти мое выбранное значение параметра. Я не понимаю, почему это происходит :(

. Примечание: Я думаю, с помощью JQuery таблицы данных код пользовательского JQuery должны быть использованы по-разному

Answer 1

Ну ребята,

Я решил это мне нужно. использовать что-то вроде этого:.

$('#employee-grid').on('change', '.changeStatus', function(){ 
    // testing..... 
    var status = $('.changeStatus').val(); 
    alert(status); 
}); 

решение состоит в том, чтобы использовать делегирование событий, предоставляя селектор для целевого элемента в качестве второго аргумента в вызове на()