Perl CGI 和 Javascript：动态相关下拉列表答案

【问题标题】：Perl CGI and Javascript: Dynamic Dependant DropdownPerl CGI 和 Javascript：动态相关下拉列表
【发布时间】：2013-10-19 16:04:22
【问题描述】：

我通常是一名 C/C++ 程序员，但我的工作认为所有软件都是一样的，所以我必须制作一个网页来将信息输入到 mysql 数据库中。由于其中一位程序员对我们所有的内部网页都使用 Perl CGI，所以为了保持一致性，我决定使用它。

我有几个不同的哈希值来存储我需要从数据库中创建下拉列表的信息。以下是哈希包含的内容：

%issues (IssueID : Issue)(问题 ID 和问题名称)

%step (StepID : Step)(stepid with name)

%stepissueid (StepID : IssueID)（将要采取的不同步骤链接到特定问题）

Perl/HTML 为问题创建下拉菜单为问题工作的下拉菜单 *第二个依赖下拉菜单没有*

#begin Issue Drop Down 
print "<td valign=\"top\" colspan=1><font $c2> Issue:<br> ";
$temp = scalar keys %issue;
print "<select id='Issue1' name=\"optone\"";
print "onchange=\"setOptions(document.myform.optone.options[document.myform.optone.selectedIndex].value);\">";
foreach my $x (sort(keys %issue))
{
    if ($x == $issueid)
    {
        print "<OPTION selected=selected value=\"$x\"> $issue{$x}</OPTION>"; 
    }
    else
    {
         print "<OPTION value=\"$x\"> $issue{$x}</OPTION>"; 
    }
}
print "</select>";

print "<select name=\"opttwo\" size=\"1\">";
print "<option>Please select one of the options above first</option>";
print "</select>";

setOptions 的 Javascript：因为我不知道有多少元素或它们是什么，所以我创建了一个循环来创建 javascript 和多个 if 语句

print "<head>";
print "<script language=\"JavaScript\">";
print "<!--";
print "function setOptions(chosen){";
print "var selbox=document.myform.opttwo;";
print "selbox.options.length = 0;";

foreach my $x (sort(keys %issue))
{
    print "if (chosen == $x)";
    {
        foreach my $y (sort(keys %step))
        {
            if ($stepissueid{$y} == $x)
            {
                print "selbox.options[selbox.options.length] = new";
                print "Options('$step{$y}','$y');";
            }
        }
    }
}
print "}";
print "//-->";
print "</script>";
 print "</head>";

编辑：我很确定有一个看不见的控制角色让事情变得一团糟，因为我真的重新输入了它并且一切正常。现在我遇到的问题是我从数据库接收信息，如果已经选择了一个选项，我希望自动选择步骤下拉列表（我知道大量的不活动时间，我还有其他更重要的项目）

我尝试添加onselect=\"setOptions(document.myform1.optone.options[document.myform1.optone.selectedIndex].value);\"> 在 opttwo 下选择 HTML，但什么也没做（试图在第二个下拉菜单中调用我的 JS 函数以自动填充）

【问题讨论】：

实际输出和期望输出是什么？
实际：下拉 1 包含 3 个问题，下拉 2 仅包含“请先选择上述选项之一”
期望：下拉菜单 1 包含 3 个问题，下拉菜单 2 包含解决下拉菜单 1 中选择的特定问题的步骤（从 %step 中找到）
既然您已经在使用 javascript，我可以建议 perl 只生成 JSON 和 javascript 来完成其余的工作吗？
我的大部分 javascript 代码都来自这里 link

标签： javascript html mysql perl cgi

【解决方案1】：

也许您的第二个代码块中有 Javascript 错误？

print "<!--";

应该是

print "//<!--";

这可能会使 js 函数不起作用，从而导致您所看到的。

Perl 推荐

我建议您使用这样的 Perl 打印结构使您的 javascript 和 HTML 更具可读性：

#begin Issue Drop Down 
$temp = scalar keys %issue;
print<<HTML_JS_EOF;
<td valign="top" colspan=1><font $c2> Issue:<br>
<select id='Issue1' name="optone"
onchange="setOptions(document.myform.optone.options[document.myform.optone.selectedIndex].value);">
HTML_JS_EOF
foreach my $x (sort(keys %issue))
{
    if ($x == $issueid)
    {
        print "<OPTION selected=selected value=\"$x\"> $issue{$x}</OPTION>"; 
    }
    else
    {
         print "<OPTION value=\"$x\"> $issue{$x}</OPTION>"; 
    }
}
print<<HTML_JS_EOF;
</select>

<select name="opttwo" size="1">
<option>Please select one of the options above first</option>
</select>
HTML_JS_EOF

【讨论】：

我将我的 js 更改为“//

【解决方案2】：

真的有必要以最艰难的方式重新发明轮子吗？在客户端使用Ext JS，在服务器端使用RPC::ExtDirect，这样可以节省大量时间。

【讨论】：