来自MySQL

时间:2015-07-02 05:09:51

标签: javascript php mysql drop-down-menu

我有以下php页面,其中有四个下拉列表正确填充了四个不同的mysql查询。 我会根据Categories_2填充CATEGORIES_1.c_id一个查询,并为其他下拉列表填充相同的内容。

试图致电myFunction() onChange,但似乎无效。我没有得到警报。

有谁知道我怎么做到这一点?任何帮助将不胜感激。

我知道我必须使用mysqli,但这是一个现有页面,我稍后会这样做。

<script>
var myDropdown=document.getElementsByName('cat1')[0];
function myFunction(){
    alert('option changed : '+myDropdown.value);
}
</script>



<form enctype="multipart/form-data" method="post" action="import.php">

        <label for="cat_name">Categories_1</label>
        <select name = "cat1" onChange="myFunction()">
        <?php
            $s = mysql_query("SELECT * FROM `CATEGORIES_1`");
            while($row = mysql_fetch_assoc($s)) {
            echo ('<option value="' . $row['c_id'] . '">' . $row['c_name'] . '</option>'); } ?>
        </select>
        <br>            

        <label for="cat_nam">Categories_2</label>
        <select>
        <?php
            $s = mysql_query("SELECT c_name FROM `CATEGORIES_2`");
            while($row = mysql_fetch_assoc($s)) {
            echo ('<option value="0">' . $row['c_name'] . '</option>'); }            ?>
        </select>
        <br>            

        <label for="cat_nae">Categories_3</label>
        <select>
        <?php
            $s = mysql_query("SELECT c_name FROM `CATEGORIES_3`");
            while($row = mysql_fetch_assoc($s)) {
            echo ('<option value="0">' . $row['c_name'] . '</option>'); } ?>
        </select>
        <br>            

        <label for="cat_ame">Categories_4</label>
        <select>
        <?php
            $s = mysql_query("SELECT c_name FROM `CATEGORIES_4`");
            while($row = mysql_fetch_assoc($s)) {
            echo ('<option value="0">' . $row['c_name'] . '</option>'); }            ?>
        </select>

4 个答案:

答案 0 :(得分:1)

你需要使用ajax ...我希望这会有所帮助..

<强> JS

def change
  create_table :rental_requests do |t|
    t.integer :hourly_rate
    t.integer :daily_rate
  end
end 

<强> FORM

$(document).ready(function(){
    $(document).on('change','#cat1',function(){
        $.ajax({
            cache: false,
            url: 'getSecondSelect.php',
            type: 'post',
            data: 'input=' + $(this).val(),
            success: function(data){
                $('#cat2').html(data)
            }
        })
    })
}

<强> getSecondSelect.php

<form enctype="multipart/form-data" method="post" action="import.php">
    <label for="cat_name">Categories_1</label>
    <select id="cat1" name="cat1">
    <?php
        $s = mysql_query("SELECT * FROM `CATEGORIES_1`");
        while($row = mysql_fetch_assoc($s)) {
        echo ('<option value="' . $row['c_id'] . '">' . $row['c_name'] . '</option>'); }
    ?>
    </select>
    <br />

    <label for="cat_name">Categories_2</label>
    <select id="cat2" name="cat2"></select>
    <br />

答案 1 :(得分:0)

这是调用您的dropdoen值的错误方法

var myDropdown=document.getElementsByName('cat1')[0];

你的myFunction将是

<script>
function myFunction(){
var myDropdown=document.getElementById('cat1');
  var myDropdowval= myDropdown[myDropdown.selectedIndex].value;
   alert(myDropdowval);
}
</script>

此处您将id id="cat1"分配到您的下拉列表

 <select name = "cat1" id="cat1" onChange="myFunction()">
    <?php
    $s = mysql_query("SELECT * FROM `CATEGORIES_1`");
    while ($row = mysql_fetch_assoc($s)) {
        echo ('<option value="' . $row['c_id'] . '">' . $row['c_name'] . '</option>');
    }
    ?>
</select>

答案 2 :(得分:0)

使用ajax调用和不同的php页面生成基于AJAX调用的响应,将选定的下拉id作为参数发送到php页面。并将传入的响应设置为您的下面的下拉菜单。 如果你使用Jquery然后使用

 $('[name=cat1]').val()

答案 3 :(得分:0)

<select id="myselect">
    <option value="1">Mr</option>
    <option value="2">Mrs</option>
    <option value="3">Ms</option>
    <option value="4">Dr</option>
    <option value="5">Prof</option>
</select>

alert($( "#myselect option:selected" ).text());

这里正在运作JSFIDDLE