在php中使用javascript使selectbox可见_Javascript_Php

在php中使用javascript使selectbox可见

javascript php

在php中使用javascript使selectbox可见,javascript,php,Javascript,Php,我正在使用php，希望我选择的selectbox根据我选择的选项变得可见。我的html代码是 <form name="frmIndex" action="index.php" method="post"> <select name="ddlSelections"> <option value="1">Tickets</option> <option value="2">Projects</o

我正在使用php，希望我选择的selectbox根据我选择的选项变得可见。我的html代码是

<form name="frmIndex" action="index.php" method="post">
    <select name="ddlSelections">
        <option value="1">Tickets</option>
        <option value="2">Projects</option>
        <option value="3">Sales</option>
    </select>
    <input type="submit" value="Select" name="btnSubmit"/><br/>
    <select name="ddlTickets" style="display:none">
        <option value="1">Open Tickets</option>
        <option value="2">Waiting for Client</option>
        <option value="3">Overdue</option>
        <option value="4">Average Age</option>
    </select>
    <select name="ddlProjects" style="display:none">
        <option value="1">Ready to Bill</option>
        <option value="2">Over Budget</option>
        <option value="3">Overdue</option>
        <option value="4">Assigned per PM</option>
    </select>
    <select name="ddlSales" style="display:none">
        <option value="1">Leads last 7/30/90</option>
        <option value="2">Open</option>
        <option value="3">Expected Value (30 days)</option>
        <option value="4">Overdue</option>
    </select>
    <input type="submit" style="display:none" value="Submit" name="btnChoose" />
</form>


售票处
项目
销售额


公开票
等待客户
逾期的
平均年龄
准备付账
超预算
逾期的
下午分配
领先于90年7月30日
打开
预期值（30天）
逾期的

到目前为止，我的php代码是

 <?php

    if(isset($_POST["btnSubmit"])) 
    {
        $selection = $_POST["ddlSelections"];   

        if ($selection == 1) {

        }
        else if ($selection == 2) {

        }
        else {

        }
    }

?>

所以我的问题是，如果要使selectbox可见，if/else语句中的javascript会是什么样子？

为什么不在客户端使用javascript呢

    <form name="frmIndex" action="index.php" method="post">
<select name="ddlSelections" id="ddlSelections" onChange="changeSelect()"> <!-- call function on change -->
    <option value="1">Tickets</option>
    <option value="2">Projects</option>
    <option value="3">Sales</option>
</select>
<input type="submit" value="Select" name="btnSubmit"/><br/>
<select name="ddlTickets"  id="ddlTickets"> <!-- visible by default -->
    <option value="1">Open Tickets</option>
    <option value="2">Waiting for Client</option>
    <option value="3">Overdue</option>
    <option value="4">Average Age</option>
</select>
<select name="ddlProjects" style="display:none" id="ddlProjects">
    <option value="1">Ready to Bill</option>
    <option value="2">Over Budget</option>
    <option value="3">Overdue</option>
    <option value="4">Assigned per PM</option>
</select>
<select name="ddlSales" style="display:none" id="ddlSales">
    <option value="1">Leads last 7/30/90</option>
    <option value="2">Open</option>
    <option value="3">Expected Value (30 days)</option>
    <option value="4">Overdue</option>
</select>
<input type="submit" style="display:none" value="Submit" name="btnChoose" />
</form>


售票处
项目
销售额


公开票
等待客户
逾期的
平均年龄
准备付账
超预算
逾期的
下午分配
领先于90年7月30日
打开
预期值（30天）
逾期的

javascript

<script>
function changeSelect()
{
document.getElementById('ddlTickets').style.display = "none";
document.getElementById('ddlProjects').style.display = "none";
document.getElementById('ddlSales').style.display = "none";
switch(document.getElementById('ddlSelections').value) // Get selected one
{
    case "1":
    document.getElementById('ddlTickets').style.display = "block";
    break;
    case "2":
    document.getElementById('ddlProjects').style.display = "block";
    break;
    case "3":
    document.getElementById('ddlSales').style.display = "block";
    break;

}
}
</script>


函数changeSelect（）
{
document.getElementById（'ddlTickets'）.style.display=“无”；
document.getElementById（'ddlProjects'）.style.display=“无”；
document.getElementById（'ddlSales'）.style.display=“无”；
开关（document.getElementById（'ddlSelections'）.value）//获取所选值
{
案例“1”：
document.getElementById（'ddlTickets'）.style.display=“block”；
打破
案例“2”：
document.getElementById（'ddlProjects'）.style.display=“block”；
打破
案例“3”：
document.getElementById（'ddlSales'）.style.display=“block”；
打破
}
}

如果必须使用PHP

<form name="frmIndex" action="index.php" method="post">


 <?php

if(isset($_POST["btnSubmit"])) 
{
    $selection = $_POST["ddlSelections"];   

    if ($selection == 1) {
        /* echo these
  <select name="ddlSelections" id="ddlSelections" >
<option value="1" selected>Tickets</option>
<option value="2">Projects</option>
<option value="3">Sales</option>
   </select>   <input type="submit" value="Select" name="btnSubmit"/><br/>
          <select name="ddlTickets" style="display:none">
    <option value="1">Open Tickets</option>
    <option value="2">Waiting for Client</option>
    <option value="3">Overdue</option>
    <option value="4">Average Age</option>
    </select>
      */
      }
       else if ($selection == 2) {
           /* echo these
   <select name="ddlSelections" id="ddlSelections" >
<option value="1" >Tickets</option>
<option value="2" selected>Projects</option>
<option value="3">Sales</option>
   </select>   <input type="submit" value="Select" name="btnSubmit"/><br/>
         <select name="ddlProjects" style="display:none" id="ddlProjects">
<option value="1">Ready to Bill</option>
<option value="2">Over Budget</option>
<option value="3">Overdue</option>
<option value="4">Assigned per PM</option>
</select>
    */
      }
     else {
    /* echo these
         <select name="ddlSelections" id="ddlSelections" >
<option value="1" >Tickets</option>
<option value="2" >Projects</option>
<option value="3" selected>Sales</option>
   </select>   <input type="submit" value="Select" name="btnSubmit"/><br/>
          <select name="ddlSales" style="display:none">
    <option value="1">Leads last 7/30/90</option>
    <option value="2">Open</option>
    <option value="3">Expected Value (30 days)</option>
    <option value="4">Overdue</option>
</select>
    */
    }
}

?>


<input type="submit" style="display:none" value="Submit" name="btnChoose" />
</form>

为什么不在客户端使用javascript

    <form name="frmIndex" action="index.php" method="post">
<select name="ddlSelections" id="ddlSelections" onChange="changeSelect()"> <!-- call function on change -->
    <option value="1">Tickets</option>
    <option value="2">Projects</option>
    <option value="3">Sales</option>
</select>
<input type="submit" value="Select" name="btnSubmit"/><br/>
<select name="ddlTickets"  id="ddlTickets"> <!-- visible by default -->
    <option value="1">Open Tickets</option>
    <option value="2">Waiting for Client</option>
    <option value="3">Overdue</option>
    <option value="4">Average Age</option>
</select>
<select name="ddlProjects" style="display:none" id="ddlProjects">
    <option value="1">Ready to Bill</option>
    <option value="2">Over Budget</option>
    <option value="3">Overdue</option>
    <option value="4">Assigned per PM</option>
</select>
<select name="ddlSales" style="display:none" id="ddlSales">
    <option value="1">Leads last 7/30/90</option>
    <option value="2">Open</option>
    <option value="3">Expected Value (30 days)</option>
    <option value="4">Overdue</option>
</select>
<input type="submit" style="display:none" value="Submit" name="btnChoose" />
</form>


售票处
项目
销售额


公开票
等待客户
逾期的
平均年龄
准备付账
超预算
逾期的
下午分配
领先于90年7月30日
打开
预期值（30天）
逾期的

javascript

<script>
function changeSelect()
{
document.getElementById('ddlTickets').style.display = "none";
document.getElementById('ddlProjects').style.display = "none";
document.getElementById('ddlSales').style.display = "none";
switch(document.getElementById('ddlSelections').value) // Get selected one
{
    case "1":
    document.getElementById('ddlTickets').style.display = "block";
    break;
    case "2":
    document.getElementById('ddlProjects').style.display = "block";
    break;
    case "3":
    document.getElementById('ddlSales').style.display = "block";
    break;

}
}
</script>


函数changeSelect（）
{
document.getElementById（'ddlTickets'）.style.display=“无”；
document.getElementById（'ddlProjects'）.style.display=“无”；
document.getElementById（'ddlSales'）.style.display=“无”；
开关（document.getElementById（'ddlSelections'）.value）//获取所选值
{
案例“1”：
document.getElementById（'ddlTickets'）.style.display=“block”；
打破
案例“2”：
document.getElementById（'ddlProjects'）.style.display=“block”；
打破
案例“3”：
document.getElementById（'ddlSales'）.style.display=“block”；
打破
}
}

如果必须使用PHP

<form name="frmIndex" action="index.php" method="post">


 <?php

if(isset($_POST["btnSubmit"])) 
{
    $selection = $_POST["ddlSelections"];   

    if ($selection == 1) {
        /* echo these
  <select name="ddlSelections" id="ddlSelections" >
<option value="1" selected>Tickets</option>
<option value="2">Projects</option>
<option value="3">Sales</option>
   </select>   <input type="submit" value="Select" name="btnSubmit"/><br/>
          <select name="ddlTickets" style="display:none">
    <option value="1">Open Tickets</option>
    <option value="2">Waiting for Client</option>
    <option value="3">Overdue</option>
    <option value="4">Average Age</option>
    </select>
      */
      }
       else if ($selection == 2) {
           /* echo these
   <select name="ddlSelections" id="ddlSelections" >
<option value="1" >Tickets</option>
<option value="2" selected>Projects</option>
<option value="3">Sales</option>
   </select>   <input type="submit" value="Select" name="btnSubmit"/><br/>
         <select name="ddlProjects" style="display:none" id="ddlProjects">
<option value="1">Ready to Bill</option>
<option value="2">Over Budget</option>
<option value="3">Overdue</option>
<option value="4">Assigned per PM</option>
</select>
    */
      }
     else {
    /* echo these
         <select name="ddlSelections" id="ddlSelections" >
<option value="1" >Tickets</option>
<option value="2" >Projects</option>
<option value="3" selected>Sales</option>
   </select>   <input type="submit" value="Select" name="btnSubmit"/><br/>
          <select name="ddlSales" style="display:none">
    <option value="1">Leads last 7/30/90</option>
    <option value="2">Open</option>
    <option value="3">Expected Value (30 days)</option>
    <option value="4">Overdue</option>
</select>
    */
    }
}

?>


<input type="submit" style="display:none" value="Submit" name="btnChoose" />
</form>

一个略短的示例，使用它比*属性上的

多，如onclick
，onchange
等
用class=“subDDL”
替换所有style=“display:none”
，然后简单地用.subDDL{display:none；}
进行样式设置。我确实为默认选项保留了一个style=“display:initial”

然后将id
添加到与ddlSelections

现在您只需要一个提交按钮

$（“[name='ddlSelections']”）。更改（函数（）{
$（“.subDDL”）.hide（）；
$（'#'+$（“[name='ddlSelections']option:selected”）.val（））.show（）；
});
.subDDL{
显示：无；
}

售票处
项目
销售额
公开票
等待客户
逾期的
平均年龄
准备付账
超预算
逾期的
下午分配
领先于90年7月30日
打开
预期值（30天）
逾期的
一个略短的示例，使用它比*
属性上的多，如onclick
，onchange
等
用class=“subDDL”
替换所有style=“display:none”
，然后简单地用.subDDL{display:none；}
进行样式设置。我确实为默认选项保留了一个style=“display:initial”

然后将id
添加到与ddlSelections

现在您只需要一个提交按钮

$（“[name='ddlSelections']”）。更改（函数（）{
$（“.subDDL”）.hide（）；
$（'#'+$（“[name='ddlSelections']option:selected”）.val（））.show（）；
});
.subDDL{
显示：无；
}

售票处
项目
销售额
公开票
等待客户
逾期的
平均年龄
准备付账
超预算
逾期的
下午分配
领先于90年7月30日
打开
预期值（30天）
逾期的
在这种情况下，使用javascript的可能重复更好，PHP无法做到这一点。它在服务器上运行。除非每次更改选择时都重新加载整个页面，否则php无法影响页面。这纯粹是javascript，PHP不以任何方式参与其中。@MarcB我认为他们确实打算重新加载整个页面，所以可以用PHP完成，尽管已经有人指出JS更适合最终目标，但我一直在问如何在我已经使用的PHP框架内使用javascript。在这种情况下，可能重复使用javascript更好。PHP无法做到这一点。它在服务器上运行。除非每次更改选择时都重新加载整个页面，否则php无法影响页面。这纯粹是javascript，PHP没有以任何方式参与其中。@MarcB我想他们确实打算重新加载整个页面，所以可以用PHP来完成，尽管已经有人指出JS更适合最终目标，goalI问如何在我已经使用的PHP框架内使用javascript。