首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >级联下拉框

级联下拉框
EN

Stack Overflow用户
提问于 2012-08-27 00:10:12
回答 2查看 1.3K关注 0票数 2

我使用了各种脚本,并尝试修改它们以适合我的数据库,但这正是我想要实现的目标

MySQL数据库,单表“列表”

我想放在一起的形式,其中用户将从数据库中选择"Make“,这将过滤”模型“的第二个下拉框,然后第三个下拉框将过滤出该特定模型的不同变体。

我的数据库包含Make、Model和Version字段

代码语言:javascript
复制
Box 1: SELECT DISTINCT Make FROM Carlist SORT BY Make
Box 2: SELECT Distinct Model FROM Carlist WHERE Make=$Make SORT BY Model
Box 3: SELECT DISTINCT Version FROM Carlist WHERE Make=$Make AND Model=$Model SORT BY Version

我还想放入一个机制,其中第二和第三个框不能被选中,直到前一个框已经被选中

我遇到的所有脚本都利用了数据库中的多个表,目前我的数据库中有超过1500条记录。

如果有人在这方面有任何有用的链接或建议,那就太好了,正如前面提到的,我曾尝试修改其他人的脚本,但没有成功,但这些脚本是为多个表设计的

EN

回答 2

Stack Overflow用户

发布于 2012-08-27 00:42:00

假设您正在尝试填充一个HTML表单,在每次选择之后使用Ajax从数据库中获取适当的drop Box值。

票数 0
EN

Stack Overflow用户

发布于 2012-08-28 19:16:36

得到了解决方案,代码如下:

代码语言:javascript
复制
<?php 
/* Written for Khaoskreations 2010-06-13 */

//db connect code
require "config.php"; // Your Database details


$query = "SELECT * FROM Carlist ";
$result = mysql_query($query);

//==============================================================================build arrays from db
$Make = array();
$Model = array();
$Version = array();

if (!$result) echo "Error: ".mysql_error();
else {
    $Make_group = "";
    $Model_group = "";
    $num = mysql_num_rows($result);

    for ($i = 0;$i<$num;$i++) {
        $r = mysql_fetch_array($result);

        if ($r['Make'] != $Make_group) {
            $Make[$r['Make']] = $r['Make'];
            $Model[$r['Make']][$r['Model']] = $r['Model'];
            $Version[$r['Make']][$r['Model']][$r['Version']] = $r['Version'];

            $Make_group = $r['Make'];
            $Model_group = $r['Make'];
        } else if ($r['Model'] != $Model_group) {
            $Model[$r['Make']][$r['Model']] = $r['Model'];
            $Version[$r['Make']][$r['Model']][$r['Version']] = $r['Version'];

            $Model_group = $r['Make'];
        } else {
            $Version[$r['Make']][$r['Model']][$r['Version']] = $r['Version'];
        }
    }
}

//==============================================================================create scripts
$script = "\n<script type='text/javascript'>\n";
//build last name array
$script .= "var Make = new Array(";
$list = "";
foreach ($Make as $key => $val) {
    $list .= " \"".$val."\",";
    //echo $val ."<br />";
}
$list = substr($list, 0, -1);
$list .= " );\n";
$script .= $list;
$list = "";
//build Model array
$script .= "\nvar Model = new Array();";
foreach ($Model as $Maken => $fary) {
    $list .= "\nModel[\"".$Maken."\"] = new Array(";
    foreach ($fary as $key => $value) {
        $list .= " \"". $value . "\",";
    }
    $list = substr($list, 0, -1);
    $list .= " );";
}

$script .= $list;
$list = "";
//build Version array
$list = "\nvar Version = new Array();";
foreach ($Version as $Maken => $fary) {
    $list .= "\nVersion[\"".$Maken."\"] = new Array();";
    foreach ($fary as $Modeln => $aary) {
        $list .= "\nVersion[\"".$Maken."\"][\"".$Modeln."\"] = new Array(";
        foreach ($aary as $key => $value) {
            $list .= " \"" . $value . "\",";
        }
        $list = substr($list, 0, -1);
        $list .= " );";
    }
}
$script .= $list;

//script functions to update tiers

$script .= <<< EOSCRIPT


function resetForm(theForm) {
    theForm.Makes.options[0] = new Option("--- Select Make ---", "");
    for (var i=0; i<Make.length; i++) {
        theForm.Makes.options[i+1] = new Option(Make[i], Make[i]);
    }
    theForm.Makes.options[0].selected = true;

    theForm.Models.options[0] = new Option("--- Select Model ---", "");
    theForm.Models.options[0].selected = true;
    theForm.Version.options[0] = new Option("--- Select Version ---", "");
    theForm.Version.options[0].selected = true;
    document.getElementById("selectbox").innerHTML = "";
}

function reloadForm(theForm,Manufacturer,product,specific) {
    theForm.Makes.options[0] = new Option("--- Select Version ---", "");
    for (var i=0; i<Make.length; i++) {
        theForm.Makes.options[i+1] = new Option(Make[i], Make[i]);
        if (Manufacturer == Make[i]) theForm.Makes.options[i+1].selected = true;
    }
    document.getElementById("selectbox").innerHTML = "here";

    var fn = Model[Manufacturer];

    theForm.Models.options.length = 0;
    for (var i=0; i<fn.length; i++) {
        theForm.Models.options[i] = new Option(fn[i], fn[i]);
        if (product == fn[i]) {
            theForm.Models.options[i].selected = true;
        }
    }

    var Versions = Version[Manufacturer][product];

    theForm.Version.options.length = 0;
    for (var i=0; i<Versions.length; i++) {
        theForm.Version.options[i] = new Option(Versions[i], Versions[i]);
        if (specific == Versions[i][0]) {
            theForm.Version.options[i].selected = true;
        }
    }
    document.getElementById("selectbox").innerHTML = "You selected person #"+specific;
}

function updateproducts(theForm) {
    var lname = theForm.Makes.options[theForm.Makes.options.selectedIndex].value;
    var fnames = Model[lname];

    theForm.Models.options.length = 0;
    for (var i=0; i<fnames.length; i++) {
        theForm.Models.options[i] = new Option(fnames[i], fnames[i]);
    }

    var findex = theForm.Models.options[theForm.Models.options.selectedIndex].value;
    var Versions = Version[lname][findex];

    theForm.Version.options.length = 0;
    for (var i=0; i<Versions.length; i++) {
        theForm.Version.options[i] = new Option(Versions[i], Versions[i]);
    }
    theForm.Version.options[0].selected = true;
}

function updateVersion(theForm) {
    var lname = theForm.Makes.options[theForm.Makes.options.selectedIndex].value;
    var findex = theForm.Models.options[theForm.Models.options.selectedIndex].value;
    var Versions = Version[lname][findex];

    theForm.Version.options.length = 0;
    for (var i=0; i<Versions.length; i++) {
        theForm.Version.options[i] = new Option(Versions[i], Versions[i]);
    }
    theForm.Version.options[0].selected = true;
}

</script>

EOSCRIPT;

$reload_script = "";
if ($_POST['Makes'] != "" && $_POST['Models'] != "") {
    $reload_script .= "<script type='text/javascript'> "
            ."reloadForm(document.vehicleform,'".$_POST['Makes']."','".$_POST['Models']."',".$_POST['Version'].");"
            ."</script>";
} else {
    $reload_script .= "<script type='text/javascript'>"
            ."resetForm(document.vehicleform);"
            ."</script>";
}

//============================================================================== build page


$page = <<< EOPAGE
<html>
    <head>
        {$script}
    </head>
    <body>
        <form method="post" action="test3.php" name='vehicleform'>
            <select name='Makes' onchange="updateproducts(this.form)"></select><BR>
            <select name="Models" onchange="updateVersion(this.form)"></select><BR>
            <select name="Version"></select>
            <input type='button' value='Reset' onclick='resetForm(document.vehicleform)'/>
            <input type='submit' value='Reload'/>
        </form>
        <div id='selectbox'></div>
        {$reload_script}
    </body>
</html>

EOPAGE;

echo $page;

?>
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/12131666

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档