En mi ventana de editar clientes implementaré un select con ajax que hará que al momento de seleccionar un departamento actualice los municipios. Sin embargo, al momento de ejecutarse el ajax, la información que regresa es, literalmente, el script que uso en el controller. A continuación el código del script en editar-clienteController:
<?php
if ($_SESSION['user']['ordenes'] == 1) {
if (count($_POST) > 0) {
if (isset($_POST['nombres']) && isset($_POST['apellidos']) && isset($_POST['direccion']) && isset($_POST['telefono']) && isset($_POST['nit']) && isset($_POST['genero']) && isset($_POST['correo'])) {
$nombres = trim(strtoupper($_POST['nombres']));
$apellidos = trim(strtoupper($_POST['apellidos']));
$direccion = trim($_POST['direccion']);
$telefono = trim($_POST['telefono']);
$nit = trim($_POST['nit']);
$genero = $_POST['genero'];
$correo = trim($_POST['correo']);
if ($nit == '') {
$nit = NULL;
}
if ($nombres == '' || $apellidos == '') {
echo '<div class="alert alert-danger alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true"><i class="fa fa-times-circle-o"></i></button>
<b>Error:</b> Rellene todos los campos.
</div>';
exit;
} else {
require_once 'models/clienteModel.php';
$e = new Cliente();
$update = $e->updateCliente($idItem, $nombres, $apellidos, $nit, $telefono, $direccion, $correo, $genero);
$e = null;
if ($update == true) {
echo '
<script>
$(location).attr("href","' . BASE_DIR . 'editar-cliente/' . $idItem . '-' . slug($nombres) . '/update");
</script>
';
} else {
echo '<div class="alert alert-danger alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true"><i class="fa fa-times-circle-o"></i></button>
<b>Error:</b> No se pudo actualizar el registro, recarge la página e inténtelo nuevamente.
</div>';
}
}
}
} else {
require_once 'models/clienteModel.php';
$c = new Cliente();
$cliente = $c->getCliente($idItem);
$c = null;
$c = new Cliente();
$tipos = $c->getTipos();
$c = null;
$c = new Cliente();
$departamento = $c->getDepartamentos();
$c = null;
if (count($cliente) > 0) {
require_once 'views/header.php';
require_once 'views/clientes-editar.php';
require_once 'views/footer.php';
}
}
} else {
require_once 'views/404.php';
}
?>
<script>
var selectElement = document.getElementById("departamentos");
var lastSearchTerm = "";
var selectedMun = $("municipio").val();
function loadMunicipios() {
var selectedDepartamento = $("#departamento").val();
if (selectedDepartamento !== lastSearchTerm) {
lastSearchTerm = selectedDepartamento;
$("#municipios").prop("disabled", true).attr("placeholder", "Cargando...");
$.ajax({
url: 'ClientesEditarMunicipios',
type: "POST",
data: {
finca: selectedDepartamento
}
}).done(function(response) {
// No es necesario dividir la cadena, ya que recibes un array directamente
updateMunicipiosDropdown(response);
console.log(response);
$("#municipio").prop("disabled", false).attr("placeholder", "Municipio");
}).fail(function(jqXHR, textStatus, errorThrown) {
console.error("Error en la llamada AJAX:", textStatus, errorThrown);
console.log("Respuesta del servidor:", jqXHR.responseText);
});
}
}
function updateMunicipiosDropdown(municipiosList) {
// Verificar si municipiosList está definido y no es nulo
if (municipiosList) {
// Intentar parsear la cadena JSON
try {
var parsedData = JSON.parse(municipiosList);
if (parsedData.success && parsedData.data.length > 0) {
var municipios = parsedData.data;
$("#municipio").empty();
for (var i = 0; i < municipios.length; i++) {
var idGenerico = municipios[i]["ID_GENERICO"];
var nombre = municipios[i]["NOMBRE"];
$("#municipio").append($('<option>', {
value: idGenerico,
text: nombre
}));
}
} else {
console.error("La respuesta no contiene datos válidos.");
}
} catch (error) {
console.error("Error al parsear la lista de municipios como JSON:", error);
}
} else {
console.error("La lista de municipios no está definida o está vacía.");
}
}
// Evento para manejar la selección en "departamentos"
$("#departamento").on("change", function() {
loadMunicipios();
});
</script>
Este script fue probado en otro apartado y funciona normalmente. El código de la URL: "ClientesEditarMunicipios" es el siguiente:
<?php
date_default_timezone_set('America/Guatemala');
if (isset($_POST['finca'])) {
$buscar = $_POST['finca'];
require_once 'models/clienteModel.php';
$p1 = new Cliente();
$resultados = $p1->getMunicipios($buscar);
$p1 = null;
error_log(print_r($resultados));
header('Content-Type: application/json');
echo json_encode($resultados);
exit;
}
Lo esperado es que devuelva un json con el formato adecuado para poder recorrerlo en el array y poder iterarlo en el select llamado #municipios, pero lo que imprime en consola "console.log(response)" es esto:
<script>
var selectElement = document.getElementById("departamentos");
var lastSearchTerm = "";
var selectedMun = $("municipio").val();
function loadMunicipios() {
var selectedDepartamento = $("#departamento").val();
if (selectedDepartamento !== lastSearchTerm) {
lastSearchTerm = selectedDepartamento;
$("#municipios").prop("disabled", true).attr("placeholder", "Cargando...");
$.ajax({
url: 'ClientesEditarMunicipios',
type: "POST",
data: {
finca: selectedDepartamento
}
}).done(function(response) {
// No es necesario dividir la cadena, ya que recibes un array directamente
updateMunicipiosDropdown(response);
console.log(response);
$("#municipio").prop("disabled", false).attr("placeholder", "Municipio");
}).fail(function(jqXHR, textStatus, errorThrown) {
console.error("Error en la llamada AJAX:", textStatus, errorThrown);
console.log("Respuesta del servidor:", jqXHR.responseText);
});
}
}
function updateMunicipiosDropdown(municipiosList) {
// Verificar si municipiosList está definido y no es nulo
if (municipiosList) {
// Intentar parsear la cadena JSON
try {
var parsedData = JSON.parse(municipiosList);
if (parsedData.success && parsedData.data.length > 0) {
var municipios = parsedData.data;
$("#municipio").empty();
for (var i = 0; i < municipios.length; i++) {
var idGenerico = municipios[i]["ID_GENERICO"];
var nombre = municipios[i]["NOMBRE"];
$("#municipio").append($('<option>', {
value: idGenerico,
text: nombre
}));
}
} else {
console.error("La respuesta no contiene datos válidos.");
}
} catch (error) {
console.error("Error al parsear la lista de municipios como JSON:", error);
}
} else {
console.error("La lista de municipios no está definida o está vacía.");
}
}
// Evento para manejar la selección en "departamentos"
$("#departamento").on("change", function() {
loadMunicipios();
});
</script>
Que es prácticamente todo el script posterior al código de editar-clienteController, pero no entiendo porque toma eso como "response".