Create Dropdown list from another Dropdown with PHP

Asked

Viewed 427 times

0

I’ve been trying to do this for a while, but I failed miserably, I’m trying a different method than the ones I saw on the forum so I don’t think I fall for duplicity.

I need to create a second dropdown from the parameters of the first, would be similar to those in which you enter your state and next appears a list with the cities of the same.

I created three files that would do that:

Html/JS In the verificalist() function, I should be able to call something that prints the list in select "listII"

<html>
<head>
<?php require("cabecalho.php"); ?>

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<!-- <script src="ajax.js"></script> -->
</head>
<body>

    <form name="listas" method="GET" action="real_time.qm.php">

    <a>Origem: </a>
    <select id="listI" name="ori">
    <option value="0"></option>

    <?php
    include ("Conectcma.php");

        $pl = "SELECT DISTINCT origem FROM reg_qm_papel";
        $plgo = mysql_query($pl, $conexao);

    while($sc_l = mysql_fetch_array($plgo)){
       echo '<option>'.$sc_l['origem'].'</option>';
    } 
        ?>

    </select>&nbsp; &nbsp;&nbsp;
        <select id="listII" name="papel">
            <!-- Imprimir a lista aqui dps que chamasse inputasse valor na primeira lista -->
        </select>


            <button class="css_btn_class" type="submit">Cadastrar</button>
    </form>


    <script>

             $(document).ready(function(){

    $('#listI').on('change', function(){
        $('#listII').html('');
        var ori = $(this).val();
        $.ajax({
            url: 'puxa.php',
            data: {
                ori: ori
            },
            type: 'GET',
            dataType: 'json',
            success: function(data){
                $.each(data, function(){
                    $('#listII').append('<option>'+this.Papel+'</option>');
                })
            }
        })
    });

})
        }

    </script>

</body>

PHP 

include ("Conectcma.php");

$ori = $_GET['ori'];

$pl1 = "SELECT Papel FROM reg_qm_papel WHERE origem = '$ori'";
$plgo1 = mysql_query($pl1, $conexao);

while($sc_l1 = mysql_fetch_assoc($plgo1)){
       $vetor[] = array_map('utf8_encode', $sc_l1);
    }  

echo json_encode($vetor);
?>

Edit1: = I inserted the Ajax function inside the index code, but it doesn’t work yet.

php javascript html ajax

  • And what error is occurring? What problem is occurring?

1 answer

1


Just try to make this change exchange this code for your checkerList():

<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<form name="listas" method="GET" action="real_time.qm.php">

    <a>Origem: </a>
    <select id="listI" name="ori">
        <option value="0">Selecione..</option>
        <?php
        include ("Conectcma.php");

        $pl = "SELECT DISTINCT origem FROM reg_qm_papel";
        $plgo = mysql_query($pl, $conexao);

        while($sc_l = mysql_fetch_array($plgo)){
            echo '<option>'.$sc_l['origem'].'</option>';
        }
        ?>
    </select>&nbsp; &nbsp;&nbsp;
    <select id="listII" name="papel">
        <!-- Imprimir a lista aqui dps que chamasse inputasse valor na primeira lista -->
    </select>
    <button class="css_btn_class" type="submit">Cadastrar</button>
</form>

<script>
    $(document).ready(function(){

        $('#listI').on('change', function(){
            $('#listII').html('');
            var ori = $(this).val();
            $.ajax({
                url: 'puxa.php',
                data: {
                    ori: ori
                },
                type: 'GET',
                dataType: 'json',
                success: function(data){
                    $.each(data, function(){
                        $('#listII').append('<option>'+this.Papel+'</option>');
                    })
                }
            })
        });

    })
</script>

  • You say delete the verificaList function and simply put this in place?

  • That, you can put in your Ajax instead, inside the $(Document). ready...

  • Sorry, I forgot to put the parameter to send in Ajax, I edited the answer

  • I made the edit in my code and it still didn’t work, I edited the question too.

  • See how this your php return, or if in devtools displays some error, I tested with a fixed array in the return of "pull.php", and it worked normal.

Browser other questions tagged php javascript html ajax

You are not signed in. Login or sign up in order to post.