简体   繁体   中英

Select option,get the option value before submit

I have 3 dropdown lists where selecting a value in 2 dropdowns triggers the 3rd dropdown to also change.

for example:

If the first dropdown list is 1 and the second dropdown list is name then the third drowpdown lists should query the Database and retrieve rows from 1name . Then, when I click on the 3rd dropdown list, it'll show me the rows from 1name .

Please help me

try this:

html page : select.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <select id='first' onchange="on_change()">
       <option value='1'>1</option>
       <option value='2'>2</option>
    </select>
    <select id='second' onchange="on_change()">
       <option value='name'>name</option>
       <option value='test'>test</option>
    </select>
    <select id='third'>
       <option value=''>select</option>
    </select>
    <script   src="https://code.jquery.com/jquery-2.2.4.min.js"   integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="   crossorigin="anonymous"></script>
    <script type="text/javascript">
        function on_change()
        {
            var f=$("#first").val();
            var s=$("#second").val();
            if(f!="" && s !="")
            {
                $.ajax({
                    type:"POST",
                    url:"test.php",
                    data:{ "first":f,"second":s},
                    success:function(res)
                    {
                        $("#third").html(res);  
                    }
                });
            }
        }
    </script>
</body>
</html>

php page : test.php

<?php
    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "test";
   $conn= mysqli_connect("localhost","root","","test");
   if($_POST['first'])
   {
     $str=$_POST['first'].$_POST['second'];
     $q="select * from test where cname='".$str."'";
     $res=mysqli_query($conn,$q);
     $data="";
     $flag="0";
     while($row=mysqli_fetch_assoc($res))
     {
        $data .="<option value='".$row['cname']."'>".$row['cname']."</option>";
        $flag++;
     }
     if($flag==0)
     {
        $data .="<option value=''>not found</option>";
     }
     echo $data;
   }
?>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM