estoy elaborando un proyecto, en el cual utilizo un modal para modificar datos de una tabla. En dicho modal tengo varios Multi Select, los cuales los cargo de la base de datos.
Puedo guardar las opciones seleccionadas en la base de datos, pero a la hora de traer el detalle del registro los multiselect no me aparecen seleccionados los valores que tengo en la base de datos, hago la consulta con un AJAX y si me trae el arreglo.
Dejo el codigo a continuación.
Index.php
<select id="multiselect" name="multiselect[]" multiple class="form-control" >
<?php
$query = "SELECT * FROM multiselect ORDER BY id ASC";
$statement = $con->prepare($query);
$statement->execute();
$result = $statement->fetchAll();
foreach($result as $row)
{
echo '<option value="'.$row["id"].'">'.$row["description"].'</option>';
}
?>
</select>
<script type="text/javascript">
$(document).ready(function(e) {
$('.tablecell').click(function() {
var ticket = this.id;
$.ajax({
type: "POST",
url: "addfile/crud.php?eks=detail",
data: "ticket="+ticket,
dataType: "json",
success: function (data) {
//Quite la consulta de la base de datos e hice pruebas manuales
var product = "1, 2, 3";
// Convert string to array
var product_array = product.split(", ");
$("#multiselect").val(product_array);
$("#multiselect").val([0]);
}
});
});
});
</script>
multiselect.js
$(document).ready(function() {
$('#multiselect').multiselect({
includeSelectAllOption: true,
buttonWidth: 200,
numberDisplayed: 2,
nSelectedText: 'selected',
nonSelectedText: 'Multi Select'
});
});
Si le quito este codigo
$('#multiselect').multiselect({
includeSelectAllOption: true,
buttonWidth: 200,
numberDisplayed: 2,
nSelectedText: 'selected',
nonSelectedText: 'Multi Select'
});
Me aparece un cuadro sin diseño y si seleccioando los option que le mande seleccionar.