Question

У меня есть 2 раскрывающихся списка на моей странице HTML: первый раскрывающийся список содержит имена столбцов базы данных, на основе которых будет заполняться второй раскрывающийся список , т. Е.

У меня есть одна таблица споля: <Student Name, Degree, City> и следующие будут записи;

1. "A", "BS", "New York"
2. "B", "BS", "Chicago"
3. "C", "MS", "Boston"
4. "D", "MS", "New York"

Так что мой первый выпадающий список будет содержать имена столбцов, например, "Степень" и "Город".

Если я выберу «Степень», во втором выпадающем списке должны появиться «BS» и «MS», а если я выберу «Город», во втором выпадающем списке должны быть выбраны «Нью-Йорк», «Бостон» и «Чикаго»..

Как я могу приступить к реализации?

[Добавление моего кода]:

метод changeSecond(first) остается точно таким же, как вы предлагали

<body>
   <form method="POST" action="" name="mainForm">
      <table>
         <tr>
            <td> Filter by: </td>
            <td>
            <div id="first">
               <select onChange="changeSecond(this.value)">
                  <option value="1">All</option>
                  <option value="2">Degree</option>
                  <option value="3">City</option>
               </select>
            </td>
         </tr>
         <tr>
            <td>&nbsp</td>
            <td>
               <div id="second">
                  <select name="val">
                     <option value=""></option>
                  </select>
               </div>
            </td>
         </tr>
      </table>
   </form>
</body>

И это second_script.php, как вы предложили:

<?
   $link = mysql_connect("localhost", "root", "");

   if (!$link)
   {
      die('Could not connect: ' . mysql_error());
   }
   if (mysql_select_db("myDatabase", $link))
   {
      $first=mysql_real_escape_string($_REQUEST["first"]);
      $query="SELECT ".$first." FROM myTable GROUP BY ".$first;
      $data=mysql_query($query);

      echo "<select id=\"second\">";
      while($row=mysql_fetch_row($data))
      {
         echo "<option value=\"".$row[0]."\">".$row[0]."</option>";
      }
      echo "</select>";
   }
   echo mysql_error();
?>

Rizwan Gill · Answer 1 · 04 сентября 2013

код основного файла, в котором вы хотите заполнить выпадающий список на основе других в приведенном ниже примере я показываю населенные пункты в раскрывающемся списке дочерних для этого города, который выбран в раскрывающемся списке родительских элементов

    <script type="text/javascript">
    function city_locality(val)
    {
    // alert (val);
    url="<?php echo $this->baseurl ?>/components/com_ezportal/includes/query.php";
    data="stid="+val;
$.post(url,data,function(data){
$("#locid").html(data);
});     
    }
    </script>
    <select name="filter_1state" id="filter_1state" onChange="city_locality(this.value)">
      <option value="0">-- Select City --</option>
      <option value="1">Lahore</option>
      <option value="2">Karachi</option>
      <option value="3">Islamabad</option>
      <option value="4">Quetta</option>
      <option value="5">Multan</option>
    </select>

код для файла query.php

    <?php 
    $link = mysql_connect('localhost', 'root', '');
    mysql_select_db('mydatabase');
    if (isset($_POST['stid']))
    {
        $stid = $_POST['stid'];
        $query= mysql_query("SELECT id,ezcity FROM tbl_locality WHERE stateid = '".$stid."' GROUP BY ezcity"); 
    ?>
        <option value="0">-- Select Locality --</option>
    <?php
        while($row = mysql_fetch_array($query))
        {
    ?>
        <option value="<?php echo $row['id']?>"><?php echo $row['ezcity']?>        </option> 
        <?php
        }
    }
    ?>

Robot Woods · Answer 2 · 17 марта 2011

Если вы хотите более динамичное решение (которое будет учитывать изменения в фоновой БД), вы можете сделать что-то вроде этого на своей странице:

<script>
        function changeSecond(first){
        var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
        {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            var res=xmlhttp.responseText;
            document.getElementById("second").innerHTML=res;
            }
          }
        xmlhttp.open("GET","second_script.php?first="+first,true);
        xmlhttp.send();
        }
        </script>
...
<select onChange="changeSecond(this.value)">
<option value="Degree">Degree</option>
<option value="City">City</option>
</select>
<div id="second"><select><option value=""></option></select></div>

, а затем скрипт, похожий на:

<?php
//database connection
$first=mysql_real_escape_string($_REQUEST["first"]);
$query="SELECT ".$first." FROM tablename GROUP BY ".$first;
$data=mysql_query($query);
echo "<select>";
while($row=mysql_fetch_row($data)){
echo "<option value=\"".$row[0]."\">".$row[0]."</option>";
}
echo "</select>";
?>

Я предполагаю, что для реальной гибкости вы также захотите динамически заполнить первый, используя mysql_field_name, в другом скрипте, аналогичном приведенному выше

Riccardo Galli · Answer 3 · 17 марта 2011

Вы можете либо предварительно загрузить и скрыть все необходимые раскрывающиеся списки, и показать их при запуске события 'change' в первом раскрывающемся списке, либо иметь два раскрывающихся списка и очистить его в том же событии 'change'.

Если вы выберете второй подход, вам следует буферизовать данные для вставки в раскрывающийся список, частично или полностью

Divyesh patel · Answer 4 · 26 января 2017

Divyesh here, your answer is
==============================
edit.php
==============================
<!-- edit.php -->
<?php
include("config.php");
$id=$_REQUEST['id'];
echo $id;
$query=mysqli_query($con,"SELECT * FROM register r
INNER JOIN country c ON r.cuid = c.cuid
INNER JOIN state s ON r.sid = s.sid
INNER JOIN city ct ON r.cid = ct.cid where id='$id'");

while($r=mysqli_fetch_array($query))
{

     $fn=$r['firstname'];
     $add=$r['address'];
     $gn=$r['gender'];
     $hobby=$r['hobby'];
     $h=explode(',',$hobby);
     $q=array('reading','traveling','cricket','drawing');
     $country=$r['cuid'];
     $state=$r['sid'];
     $city=$r['cid'];
     echo $gn;
     $edu= $r['education'];
     $email=$r['email'];
     $pass=$r['password'];
     $conpass=$r['conpassword'];
     $phno=$r['phoneno'];
}

?>
<html>
<head>
    <script src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){

    $('#country').on('change',function(){
        var countryID = $(this).val();
        if(countryID){
            $.ajax({
                type:'POST',
                url:'ajaxData.php',
                data:'cuid='+countryID,
                success:function(html){
                    $('#state').html(html);
                    $('#city').html(html); 
                }
            }); 
        }else{
            $('#state').html(html);
            $('#city').html(html); 
        }
    });

    $('#state').on('change',function(){
        var stateID = $(this).val();
        if(stateID){
            $.ajax({
                type:'POST',
                url:'ajaxData.php',
                data:'sid='+stateID,
                success:function(html){
                    $('#city').html(html);
                }
            }); 
        }else{
            $('#city').html(html); 
        }
    });
});
</script>
</head>
    <body>
        <form method="post" action="update.php">
            <table border="1" align="center">
            <caption>Edit user data</caption>
            <tr>
                <td>First name</td>
                <td><input type="text" name="fn" value="<?php echo $fn;?>"></td>
            </tr>
            <tr>
                <td>Address</td>
                <td><input type="text" name="add" value="<?php echo $add;?>"></td>
            </tr>
            <tr>
                <td>Gender</td>
                <td><input type="radio" name="gn" value="male" <?php echo ($gn=='male')?'checked':'' ; ?> size="17">Male
                <input type="radio" name="gn" value="female" <?php echo ($gn=='female')?'checked':'' ; ?> size="17">Female
                </td>
            </tr>
            <tr>
                <td>Hobby</td>
                <td><input type="checkbox" name="hobby[]" value="reading" <?php if(in_array('reading',$h)){echo ("checked:'checked'");}?> >reading
                <input type="checkbox" name="hobby[]" value="traveling" <?php if(in_array('traveling',$h)){echo ("checked:'checked'");}?> >traveling
                <input type="checkbox" name="hobby[]" value="cricket" <?php if(in_array('cricket',$h)){echo ("checked:'checked'");}?> >cricket
                <input type="checkbox" name="hobby[]" value="drawing" <?php if(in_array('drawing',$h)){echo ("checked:'checked'");}?> >drawing</td>
            </tr>
            <?php
            $query = mysqli_query($con,"SELECT * FROM country");

            //Count total number of rows
            $rowCount = mysqli_num_rows($query);
            ?>
            <td>Country</td>
            <td><select name="country" id="country">
                <option value="<?php echo $country;?>"><?php echo $country;?></option>
                <?php
                if($rowCount > 0)
                {
                    while($row = mysqli_fetch_array($query))
                    { 
                        echo '<option value="'.$row['cuid'].'">'.$row['country'].'</option>';
                    }
                }
                else
                {
                    echo '<option value="">Country not available</option>';
                }
                ?>
            </select>
            </td></tr>
            <tr>
            <td>State</td>
            <td>
            <select name="state" id="state">
                <option value="<?php echo $state;?>"><?php echo $state;?></option>

            </select>
            </td></tr>
            <tr>
            <td>City</td>
            <td>
            <select name="city" id="city">
                <option value="<?php echo $city;?>"><?php echo $city;?></option>

            </select>
            </td>
            </tr>
            <tr>
                <td>Education</td>
                <td><input type="text" name="edu" value="<?php echo $edu;?>"></td>
            </tr>
                <td>Email</td>
                <td><input type="text" name="email" value="<?php echo $email;?>"></td>
            </tr>
            <tr>
                <td>Password</td>
                <td><input type="text" name="pass" value="<?php echo $pass;?>"></td>
            </tr>
            <tr>
                <td>Confirm password</td>
                <td><input type="text" name="conpass" value="<?php echo $conpass;?>"></td>
            </tr>
            <tr>
                <td>Phone no</td>
                <td><input type="text" name="phno" value="<?php echo $phno;?>"></td>
            </tr>
            <tr>
                <td><input type="hidden" name="id" value="<?php echo $id;?>">
                <input type="submit" name="update" value="update"></td>
            </tr>
            </table>
        </form>
    </body>
</html>

================
<h3>ajaxData.php</h3>
================
<!--ajaxData.php-->
<?php
//Include database configuration file
include("config.php");

if(isset($_POST["cuid"]) && !empty($_POST["cuid"]))
{
    //Get all state data
    $query = mysqli_query($con,"SELECT * FROM state WHERE cuid = ".$_POST['cuid']."");

    //Count total number of rows
    $rowCount = mysqli_num_rows($query);

    //Display states list
    if($rowCount > 0)
    {
        echo '<option value="">Select state</option>';
        while($row =  mysqli_fetch_array($query))
        { 
            echo '<option value="'.$row['sid'].'">'.$row['state'].'</option>';
        }
    }
    else
    {
        echo '<option value="">State not available</option>';
    }
}

if(isset($_POST["sid"]) && !empty($_POST["sid"]))
{
    //Get all city data
    $query = mysqli_query($con,"SELECT * FROM city WHERE sid =".$_POST['sid']."");

    //Count total number of rows
    $rowCount = mysqli_num_rows($query);

    //Display cities list
    if($rowCount > 0)
    {
        echo '<option value="">Select city</option>';
        while($row = mysqli_fetch_array($query))
        { 
            echo '<option value="'.$row['cid'].'">'.$row['city'].'</option>';
        }
    }
    else
    {
        echo '<option value="">City not available</option>';
    }
}
?>

Raj · Answer 5 · 14 сентября 2016

Для этой цели вы можете использовать ajax

eg1.html

    <html>
    <head><title></title>
    </head>
    <body>
    <form method="POST" action="" name="mainForm">
    <table>
        <tr>
            <td> Filter by: </td>
            <td>
                <div id="first">
                   <select id="first_dropdown">
                      <option value="All">All</option>
                      <option value="Degree">Degree</option>
                      <option value="City">City</option>
                   </select>
            </td>
         </tr>
         <tr>
            <td>&nbsp</td>
            <td>
               <div id="second">
                  <select id="second_dropdown">

                  </select>
               </div>
            </td>
         </tr>
      </table>
   </form>
</body>
</html>

    <script src = "https://code.jquery.com/jquery-3.1.0.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        $('#first_dropdown').change(function(){
            $.ajax({
                'type' : 'post',
                'url' : 'getDropdownOptions.php',
                'data': 'first=' + $(this).val(),
                'success' : function(data) {
                    $('#second_dropdown').html(data);
                }
             });
          });
        });
    </script>

getDropdownOptions.php

    <?php

    $link = mysql_connect("localhost", "root", "");

    if (!$link) {
        die('Could not connect: ' . mysql_error());
    }
    if (mysql_select_db("myDatabase", $link)) {
        $first = mysql_real_escape_string($_REQUEST["first"]);
        $query = "SELECT " . $first . " FROM myTable GROUP BY " . $first;
        $data  = mysql_query($query);

        $rtn_data = '';
        while ($row = mysql_fetch_row($data)) {
            $rtn_data .= "<option value=\"" . $row[0] . "\">" . $row[0] . "        </option>";
        }
        echo $rtn_data;
        exit;
    }
    echo mysql_error();

    ?>

Заполнение раскрывающегося списка - PHP Ajax MySQL

Пожалуйста, войдите или зарегистрируйтесь чтобы ответить на этот вопрос.

Ответы [ 5 ]

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

eg1.html

getDropdownOptions.php

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

Заполнение раскрывающегося списка - PHP Ajax MySQL

Пожалуйста, войдите или зарегистрируйтесь чтобы ответить на этот вопрос.

Ответы [ 5 ]

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

eg1.html

getDropdownOptions.php

Пожалуйста, войдите или зарегистрируйтесь что бы добавить комментарий.

Нет похожих вопросов