Aquí un pequeño screenshot para que tengan una idea
Este es el marcado
Código HTML:
Ver original
en el div id="ResultadosBusqueda" es donde se muestran los resultados, el contenido de esto lo llamo desde un archivo externo, y el div id="Buscador" es mi input...
Este es el archivo que me recibe un objeto con toda la data (Previamente se hizo la consulta y $m es un objeto con la info) y hago un echo en formato json colocandole el elemento "value" para retornarlo
Código PHP:
<?php
$m = $this->obtenerDato("motivoBuscado");
//var_dump($m[0]);
$cad = "[\n";
if (is_array($m)){
for ($i= 0 ; $i < count($m); $i++){
$o = $m[$i];
$cad .= "
{
\"label\":\"" . $o->obtenerDescripcion() . "(" . $o->obtenerId() . ")\",
\"value\":{\"id\":\"" . $o->obtenerId() . "\",\"descripcion\":\"" . $o->obtenerDescripcion() . "\",\"atribucionId\":\"" . $o->obtenerAtribucionId() . "\",\"pasaNomina\":\"" . $o->obtenerPasaNomina() . "\",\"finesSemana\":\"" . $o->obtenerFinesSemana() . "\",\"usuarioCreador\":\"" . $o->obtenerUsuarioCreador() . "\",\"fechaCreacion\":\"" . $o->obtenerFechaCreacion() . "\",\"usuarioModificador\":\"" . $o->obtenerUsuarioModificador() . "\",\"fechaModificacion\":\"" . $o->obtenerFechaModificacion() . "\"}
}";
if ($i < count($m) -1) {
$cad .= ", ";
}
$cad .= "\n";
}
}
$cad .= "]\n";
echo "$cad";
?>
La cadena $cad (ya en formato json) lo recibe el siguiente script
Código Javascript:
Ver original
//Para el buscador con autocompletado $('#BuscarMotivo').autocomplete({ source: function( request, response ) { $('#CargandoGif').show(); $.ajax({ type:"get", dataType: "json", url: "index.php", data:{m_modulo:"motivo", m_accion:"buscar", m_vista:"buscado", m_formato:"json", patron: request.term }, success: function(data){ $('#CargandoGif').hide(); return response(data); }, error: function(data){ $('#CargandoGif').hide(); return response([{"label": "ERROR DE CONEXION", "value": {"id":""}}]); } }); }, //No le paren a esto, que esto es para llenar el div #ResultadosBusqueda, hago unas validaciones y armo un html select : function(event,ui){ $('#ResultadosBusqueda').show('slow'); if (ui.item.value.atribucionId==1){ var atribucionDesc = 'Retraso en Minutos'; }else if (ui.item.atribucion==2){ var atribucionDesc = 'Ausentismo en Horas'; }else if (ui.item.atribucion==3){ var atribucionDesc = 'Ausentismo en Días'; }else if (ui.item.atribucion==4){ var atribucionDesc = 'Horas Extras'; } //Se arma un html con la funcion .html donde se muestran los resultados $("#BuscarMotivo").val(ui.item.value.id); $('#ResultadosBusqueda').html( '<table id =\'ResultadosTbl\' class=\'table table-bordered table-hover\'>'+ '<tr>'+ '<td colspan=\'2\'><h5>Resultado</h5></td>'+ '</tr>'+ '<tr>'+ '<td>Código</td><td>'+ui.item.value.id+'</td>'+ '</tr>'+ '<tr>'+ '<td>Descripción</td><td>'+ui.item.value.descripcion+'</td>'+ '</tr>' + '<tr>'+ '<td>Categoría</td><td>'+atribucionDesc+'</td>'+ '</tr>'+ '<tr>'+ '<td>Pasa a Nómina</td><td>'+(ui.item.value.pasaNomina==1?'Si':'No')+'</td>'+ '</tr>'+ '<tr>'+ '<td>Fines de Semana</td><td>'+(ui.item.finesSemana==1?'Si':'No')+'</td>'+ '</tr>'+ '<tr>'+ '<td colspan=\'2\'><a href=\'#\' id=\'Ocultar\'>Ocultar</a>'+ '<button class=\'btn pull-right eliminar\' value=\''+ui.item.value.id+','+ui.item.value.descripcion+'\'>Eliminar<i class=\'icon-trash\'></i></button>'+ '<button class=\'btn pull-right editar\' value=\''+ui.item.value.id+','+ui.item.value.descripcion+','+ui.item.value.atribucionId+','+ui.item.value.pasaNomina+','+ui.item.finesSemana+'\'>Editar</button>'+ '</td>'+ '</tr>'+ '</table>' ); $('#Ocultar').on('click',function(){ $('#ResultadosBusqueda').hide('slow'); }); //Dispara el modal de eliminar, la validación de los campos y la ejecución del ajax de eliminar eliminar(); //Dispara el modal editar, la validación de los campos y la ejecución del ajax de editar editar(); } });
Espero haberme explicado bien... La verdad no hallo como solucionarlo, he puesto distintas banderas, alerts a medida que avanza el script, pero no logro saber donde se hace ese cambio...
Espero su ayuda colegas,, saludos.