0

私はhtmlとphpを学んでいます.id、名前、部門、および契約の種類を格納するEmployees_hiredというテーブルがあるmysql DBの従業員がいます。部署の種類と特定の契約の種類に属する従業員のドロップダウン リストを作成したいと考えています。コードでは次のようになります。

<html>      
<head>
    <title>Dynamic Drop Down List</title>
</head>
<body>
    <form id="form1" name="form1" method="post" action="<?php $_SERVER['PHP_SELF']?>">
        department: 
        <select id="department" name="department" onchange="run()">  <!--Call run() function-->
            <option value="biology">biology</option>
            <option value="chemestry">chemestry</option>
            <option value="physic">physic</option>
            <option value="math">math</option>     
        </select><br><br>
        type_hire: 
        <select id="type_hire" name="type_hire" onchange="run()">  <!--Call run() function-->
            <option value="internal">Intenal</option>
            <option value="external">External</option>                
        </select><br><br>
        list of employees:
        <select name='employees'>
            <option value="">--- Select ---</option>
            <?php
            mysql_connect("localhost","root","");
            mysql_select_db("employees_hired");
            $list=mysql_query("SELECT name FROM usuario WHERE (department ='". $value_of_department_list ."') AND (contrasena ='". $value_of_type_hire."')";);
            while($row_list=mysql_fetch_assoc($list)){
            ?>
            <option value="<?php echo $row_list['name']; ?>">
                <?php if($row_list['name']==$select){ echo $row_list['name']; } ?>
            </option>
            <?php
            }
            ?>
        </select>
    </form> 
</body>
</html>

私が持っている質問は、クエリで使用するために最初のドロップダウン リスト (type_hire と department) から選択した値を取得し、従業員のドロップダウン リストに入力する方法です。DB にクエリを実行してドロップダウン リストに入力する方法は知っていますが (オンライン コースで学んだこと)、ドロップダウン リストから値を取得して実際に使用する方法はわかりません。「document.getElementById (" id "). Value」を使用してその値をクエリの変数に与えることができると読みましたが、その方法についてはどこにも詳しく説明されていません。私は Web プログラミングが初めてで、Javascript の知識が乏しいです。誰でもこれを行うための最良の方法を教えてもらえますか?. html と php のみを使用して可能ですか、それとも javascript を使用する必要がありますか?

4

2 に答える 2

2

コードの変更された jQuery バージョンを次に示します。(一部クリーンアップあり)

<html>      
<head>
     <title>Dynamic Drop Down List</title>
</head>
<body>
    <form id="form1" name="form1" method="post" action="<? $_SERVER['PHP_SELF']?>">
        department: 
        <select id="department" name="department" onchange="run()">  
            <!--Call run() function-->
            <option value="biology">biology</option>
            <option value="chemestry">chemestry</option>
            <option value="physic">physic</option>
            <option value="math">math</option>     
        </select><br><br>
        type_hire: 
        <select id="type_hire" name="type_hire" onchange="run()">  
            <!--Call run() function-->
            <option value="internal">Intenal</option>
            <option value="external">External</option>               
        </select><br><br>
        list of employees:
        <select name='employees'>
            <option value="">--- Select ---</option>
            <?php
            mysql_connect("localhost","root","");
            mysql_select_db("employees_hired");
            $list=mysql_query("SELECT name FROM usuario WHERE (department ='". $value_of_department_list ."') AND (contrasena ='". $value_of_type_hire."')";);
            while($row_list=mysql_fetch_assoc($list)){
            ?>
            <option value="<?php echo $row_list['name']; ?>">
                <? if($row_list['name']==$select){ echo $row_list['name']; } ?>
            </option>
            <?php
            }
            ?>
        </select>
    </form> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <!--[ I'M GOING TO INCLUDE THE SCRIPT PART DOWN BELOW ]-->
</body>
</html>

タグをクリーンアップし、googleapis free cdn を使用して jQuery へのホットリンクを追加しました。次は実際の JavaScript です。ところで。PHP で MYSQL_* 関数を使用しないでください。それらは減価償却されます。詳細については、 http://php.net/manual/en/mysqlinfo.library.choosing.phpをご覧ください。スクリプトに...

<script type="text/javascript">
$('#type_hire').change(function() {
   var selected = $('#type_hire option:selected');  //This should be the selected object
   $.get('DropdownRetrievalScript.php', { 'option': selected.val() }, function(data) {
      //Now data is the results from the DropdownRetrievalScript.php
      $('select[name="employees"]').html(data);
   }
}
</script>

今、私はそれをフリーハンドで処理しました。しかし、私はそれを通してあなたを歩こうとします。まず、監視したい "select" タグを取得します (ハッシュタグは、ID で要素を検索することを意味します)。次に、その中で選択したオプションを取得します。次に、AJAX 呼び出しを実行して、作成するページ "DropdownRetrievalScript.php" で GET を実行します。そのスクリプトがすべきことは、GET 変数の「オプション」を取り、それをデータベースで実行することです。次に、「オプション」タグをエコーアウトします。次に、javascript がこれらの結果を取得し、従業員の name 属性を使用して select タグに直接挿入します。

AJAX は、その URL をブラウザに入力するようなものです。したがって、データ変数は文字通り、URL が表示するコードまたはテキストです。テキスト、HTML、JSON、XML など、何でもかまいません。

于 2013-09-19T01:18:17.847 に答える