Jq Event Didnt Active On The Extract Row Sort By Datatable.js January 30, 2024 Post a Comment I'm using DataTable.js to showing the data and I have some option in my and DataTable are showing the 10 frist row with default param and I have a changeSolution 1: This works for me hopefully it will work for you so try this $('#example tbody').on( 'change', 'select[name="your_select_name"]',function(){ var data = ''; data = example.row( $(this).parents('tr') ).data(); var clientid = data['your column name']; var selectId = this.value; console.log(clientId); console.log(selectedId); //if id is okay do an ajax call inside a function something like thisif(clientid != undefined){ ajaxCallBack(clientId,selectedId) .done(function(response){ //your update response here }) } }) CopyThe ajax function:functionajaxCallBack(clientId,selectId){ return $.ajax({ method: "POST", url: "YourUrl", data: { action: "UPD", clientId: clientId, selectId: selectId} }) } CopyEdit:Your datatable should be declared like this: var example= $('#example').DataTable({ "destroy": true, "responsive":{ "details": { renderer: function ( api, rowIdx, columns ) { vardata = $.map( columns, function ( col, i ) { return col.hidden ? '<tr data-dt-row="'+col.rowIndex+'" data-dt-column="'+col.columnIndex+'">'+ '<td>'+col.title+':'+'</td> '+ '<td>'+col.data+'</td>'+ '</tr>' : ''; } ).join(''); returndata ?$('<table/>').append( data ) :false; } } }, "autoWidth": false, "ajax": { "url": 'some.php', "method": 'POST', data:{accion:"SLC"} }, "columns": [ {"data": "client"}, {"data": "name"}, {"data": "lastname"}, {"data": "device"}, {"data": "city"}, { className: "center", defaultContent:"<select id='idSelect' name ='idSelect' ><option value='default'>Seleccionar</option><option value='1'>hello</option></select>" } ], "language":{"url": "//cdn.datatables.net/plug-ins/1.10.15/i18n/Spanish.json"}, "columnDefs": [ { "className": "dt-center", "targets": "_all" } ] } ); CopyHope it helpsSolution 2: ok i fixed the event inactive on other row but these an other probleme is the event are duplicate[old] $("select[name='type']").change(function(){ var type_req = $(this).val(); var id = $(this).closest('tr').find('td#id_commande').html(); var action ="update"; var action_infos = "type_req"; console.log("change event active"); console.log(type_req); console.log(id); $.ajax({ type: "POST", url: "../controllers/commandeController.private.php", data:{id:id ,action : action ,action_infos : action_infos ,type : type_req}, success:function(){toastr.success("Modification commande réussi")}, error:function(){toastr.error("Modification commande impossible")}, }); }); Copy[new]$('table[name="commandeTable"]').on("click",function(){ $("select[name='type']").change(function(){ var type_req = $(this).val(); var id = $(this).closest('tr').find('td#id_commande').html(); var action ="update"; var action_infos = "type_req"; console.log("change event active"); console.log(type_req); console.log(id); $.ajax({ type: "POST", url: "../controllers/commandeController.private.php", data:{id:id ,action : action ,action_infos : action_infos ,type : type_req}, success:function(){toastr.success("Modification commande réussi")}, error:function(){toastr.error("Modification commande impossible")}, }); }); }); Copy Share Post a Comment for "Jq Event Didnt Active On The Extract Row Sort By Datatable.js"