ccc

Jqueryui: autocomplemente

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Autocomplete</title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
</head>

<body>
    <input type="hidden" name="id_provincia" id="id_provincia" value="">
    Provincia: <input type="text" name="dc_provincia" id="dc_provincia" class="autocomplete" style="width:300px;">


<script>
$(function() {
    $(".autocomplete").autocomplete({
        minLength : 2, // debe escribir 2 caracteres como mínimo
        source : function(request, response) {
            // $("#id_provincia").val("");
           
            $.ajax({
                url : "obtener_provincias.php",
                dataType : "json",
                data : {
                    buscar: request.term,
                    maxRows: 10
                },
                success : function(data) {
                    // console.log("DATOS ARRAY:"+data);
                    response($.map(data, function(item) {
                            return {
                                label : item.dc_provincia,
                                value:  item.id_provincia
                            }
                    }));
                }
            });
        },
        select : function(event, ui) {
            $("#id_provincia").val(ui.item.value);
            $("#dc_provincia").val(ui.item.label);
            return false;
        },
        open : function() {
        },
        close : function() {
        }
    });
});
</script>

</body>
</html>

-------------------------------------------------------------------
obtener_provincias.php:
<?php
require_once $_SERVER['DOCUMENT_ROOT'].'/gestor/comun/Conf.php';   
$conn = new CConnectionDB();
$conn->connect();

$query = "select id_provincia, dc_provincia from provincia where dc_provincia like '%".$_REQUEST["buscar"]."%' order by dc_provincia";
$result = $conn->load($query);

//print_r($result);

$newArr = array();
foreach ($result as $clave => $valor) {
    $datos = array();
    $datos["id_provincia"] = $valor->id_provincia;
    $datos["dc_provincia"] = utf8_encode($valor->dc_provincia);
    $newArr[] = $datos;
}
$salida =   json_encode($newArr);

echo $salida;
?>

No hay comentarios:

Publicar un comentario