根据选择填充额外的下拉列表

时间:2014-03-14 14:46:46

标签: php jquery

首先这个代码就像一个魅力,我的问题是添加一个功能。 我想知道如何根据选择填充下一个下拉列表。例如,我选择第一批股票' US500'它会告诉我第二次下拉的价格。我怎么能这样做?

data.php

<?php
if(!empty($_GET['getlist']))
{
    $list = $_GET['getlist'];
    $qry='';
    switch($list)
    {
        case 'tracks':
        {
            $qry = "SELECT TABLE_NAME as allStocks FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_SCHEMA = 'db_stocks' AND TABLE_ROWS > 100";
            break;
        }
    }
    if(empty($qry)){ echo "invalid params! "; exit; }

    $dbconn = mysql_connect('localhost','user','pass') 
            or die("DB login failed!");

    mysql_select_db('db_nadex_stocks', $dbconn) 
            or die("Database does not exist! ".mysql_error($dbconn));

    $result = mysql_query($qry,$dbconn)
            or die("Query $qry failed! ".mysql_error($dbconn));

    $rows = array();

    while($rec = mysql_fetch_assoc($result)) 
    {
        $rows[] = $rec;
    }
    mysql_free_result($result);
    mysql_close($dbconn);

    echo json_encode($rows);
}
?>

的index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>List Sample 1</title>
<style>
body{ font-family : Arial, Helvetica, sans-serif; font-size : 1em;}
h1 {font-size : 18pt;   color : #000066;}
h2 {font-size : 14pt;   color : #000066;}
a:hover{text-decoration : none;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
    function loadlist(selobj,url,nameattr) {
        $(selobj).empty();
        $.getJSON(url,{},function(data)
        {
            $.each(data, function(i,obj)
            {
                $(selobj).append($('<option></option>').val(obj[nameattr]).html(obj[nameattr]));
            });
        });
    }

    $(function() { 
       loadlist($('select#sel1').get(0), 'data.php?getlist=tracks','allStocks');
       loadlist($('select#sel2').get(0), 'data.php?getlist=tracks','allStocks');
       loadlist($('select#sel3').get(0), 'data.php?getlist=tracks','allStocks');
    });
</script>
</head>

<body>
<h1>Dynamically lists: multiple lists</h1>
<p>
dfgdgf 1:<select name='sdfsdf' id='sel1' size='1'></select>
</p>
<p>
cvbcvb 2:<select name='sdfsdf' id='sel2' size='1'></select>
</p>
<p>
cvbcv 3:<select name='dfgdfg' id='sel3' size='1'></select>
</p>

</body>
</html>

1 个答案:

答案 0 :(得分:2)

您需要在第一个下拉列表中添加onChange,然后将第一个下拉列表的选定索引发送到同一个函数。在onChange中有这样的东西。

loadlist($('select#sel2').get(0), 'data.php?getlist=prices&stock_id=' + $(this).val(),'allStocks');

然后在switch语句中添加使用stock_id检查“价格”和查询的价格

$_GET['stock_id']