Buenas, tengo un DataTable en el cual varios botones con modales, en esos modales tengo varios <select>
con su select2, estos me funcionan correctamente, pero cuando quiero utilizar la misma clase de uno de esos select2 para hacer otro desplegable en la DataTable no me funciona, no sé si puede llegar a ser por el scope de las variables.. no lo comprendo.
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>";
}
}
]
});
Cualquier error ortográfico es porque he tenido que adaptar un poco el código para que se entienda mejor, pero todo está correcto en mi código excepto el problema indicado arriba.
Gracias de antemano.