Dynamic Combobox

Question

Dynamic Combobox

Navigation

#1 by (1 votes)

1

I have these two selects:

<td>
        <strong><label for="Valência">Valência</label></strong>
        <select id="Valencia" name="Valencia" style="width:150px">
       <option></option>
        <?php        
         $sql = "SELECT descricaovalencia, Entidade  FROM centrodb.utentes GROUP BY descricaovalencia, Entidade"; 
                $qr = mysqli_query($conn, $sql); 
                while($ln = mysqli_fetch_assoc($qr)){ 
                    echo '<option value="'.$ln['descricaovalencia'].'"> '.$ln['descricaovalencia'].'</option>'; 
                    $valencia[$ln['descricaovalencia']]=array('Entidade'=>$ln['Entidade'],'Entidade'=>$ln['Entidade']); 
                } 
      ?>        
    </select>
        </td>

<td>
        <strong><label for="Entidade">Entidade</label></strong>
        <select id="Entidade" name="Entidade" style="width:150px">
       <option></option>
        <?php        
         foreach ($valencia as $key => $value) { 
                    echo '<option data-id="'.$key.'" value="'.$value['Entidade'].'">'.$value['Entidade'].'</option>'; 
                }
      ?>        
    </select>
        </td>

I have this script:

$('#Valencia').change(function(){ 
var id = $('#Valencia option:selected').val(); 
$.each($('#Entidade option'),function(){ 
if($(this).attr('data-id')==id){ 
$(this).attr('selected',true); 
} 
}); 
});

Result on first combobox:

ButherewhatIintendisthatonlyappearoncethenameofthevalencesandnotsorepeated.Resultofthesecondcombobox:

Here in this combobox is not returning all users.

But the idea was to select a value in the first combobox and in this all users who belong to that valence appear to select the desired one.

html script

asked by anonymous 02.08.2018 / 04:00

1 answer

How to Bind the Visibility of a Label to the Size of a List Execute method / function when loading page

score 1 · Accepted Answer

With $.Ajax() you do what you want

First <select></select> :

<td>
    <strong><label for="Valência">Valência</label></strong>
    <select id="Valencia" name="Valencia" style="width:150px">
        <option></option>
        <?php
            $sql = "SELECT descricaovalencia  FROM centrodb.utentes GROUP BY descricaovalencia"; 
            $qr = mysqli_query($conn, $sql);
            while($ln = mysqli_fetch_assoc($qr)){ 
                echo '<option value="'.$ln['descricaovalencia'].'"> '.$ln['descricaovalencia'].'</option>'; 
            }
        ?>
    </select>
</td>

Second <select></select> :

<td>
    <strong><label for="Entidade">Entidade</label></strong>
    <select id="Entidade" name="Entidade" style="width:150px">
        <option></option>
    </select>
</td>

Event change() with $.Ajax() :

<script type="text/javascript">
    $('#Valencia').change(function(){ 
        var data = {"valencia":$('#Valencia option:selected').val()};
        $.ajax({
            type:"POST",
            url:"./produto_102",
            dataType:"Json",
            data:data,
            success:function(callback){
                $("#Entidade").html("");
                $.each(callback,function(key,value){
                    $("#Entidade").append(value);
                });
            }
        });
    });
</script>

PHP :

if((isset($_POST["valencia"]))&&!empty($_POST["valencia"])){
    $valencia = $_POST["valencia"];
    $sql="SELECT Entidade FROM centrodb.utentes WHERE descricaovalencia = '$valencia'";
    $qr = mysqli_query($conn, $sql);
    while($ln = mysqli_fetch_assoc($qr)){
        $entidade[]='<option value="'.$ln['Entidade'].'">'.$ln['Entidade'].'</option>';
    }
    echo json_encode($entidade);
}