Good, I have a DataTable in which several buttons with manners, in those manners I have several <select> with its select2, these work correctly, but when I want to use the same class of one of those select2 to do another dropdown in the DataTable does not work for me, I do not know if it can be because of the scope of the variables ... I do not understand it.
HTML
<table id="tblClientes" class="table table-bordered dataTable">
<thead>
<tr role="row">
<th>ID</th>
<th>Código</th>
<th>Cliente</th>
<th>Telefono</th>
<th>Direccion</th>
<th>Email</th>
<th width="8%">Acciones</th>
</tr>
</thead>
</table>
// SCRIPTS DE JQUERY, DATATABLE, SELECT2, ETC ETC.
<script src="/js/select2-ajax.js"></script>
<script src="/js/clientes.js"></script>
select2-ajax.js
$(document).ready(function(){
$(".select_clientes").select2({
placeholder: 'Seleccionar..',
ajax: {
url: "/select2/select2-clientes.php",
dataType: 'json',
delay: 250,
data: function (params) {
return {
q: params.term, // search term
page: params.page
};
},
processResults: function (data, page) {
return {
results: data.items
};
},
cache: true
},
escapeMarkup: function (markup) { return markup; },
});
}
clientes.js
$(document).ready(function() {
var table = $('#tblClientes').DataTable({
'paging': true,
'info': true,
'filter': true,
'stateSave': true,
'processing': true,
'serverSide': true,
'ajax': {
"method": "POST",
"url": "/datatables/clientes"
},
"columns": [
{"data": "id"},
{"data": "cod"},
{
render: function() {
return "<select class='select_clientes'></select>";
}
},
{"data": "telefono"},
{"data": "direccion"},
{"data": "email"},
{
render: function() {
return "<button id='editar'></button>";
}
}
]
});
Any spelling mistake is because I have had to adapt the code a bit to make it better understood, but everything is correct in my code except the problem indicated above.
Thanks in advance.