单击表单上的提交按钮时如何显示表

时间:2016-07-12 09:34:14

标签: javascript php html css

我目前正在开展一个项目,以便在用户输入教师时显示教师的时间表。我想在他们点击提交后显示表,而不是在向他们询问id时显示空表。 这是我正在进行的代码的一部分。该表只应在单击提交按钮后显示。当前页面显示一个输入文本框,一个提交按钮和一个空表,在单击提交按钮后填充该表。

<body>
<div class="container">
<h1>Faculty Timetable</h1>
<br> 
<form method="POST" action="<?php echo $_SERVER["PHP_SELF"]; ?>" >
Enter Faculty Employee ID:<input type="text" name="FacEmployeeId">   
<input type="submit" name="Submit">
<br><br>
<?php
//$facid="";
if($_SERVER["REQUEST_METHOD"]=="POST")
$facid=$_POST['FacEmployeeId'];
if(isset($facid)){
echo "<p align='center'><b>Timetable for Faculty ID ". $facid ."<br></b>               `   `</p>";}
?>
<br><br>
<table id="table_id" class="table table-bordered">
<thead>
<tr>
<th>         </th>
<th>8.00-8.50</th>
<th>9.00-9.50</th>
<th>10.00-10.50</th>
<th>11.00-11.50</th>
<th>11.50-13.00</th>
<th>13.00-13.50</th>
<th>14.00-14.50</th>
<th>14.55-.15.45</th>
<th>15.50-16.40</th>
<th>16.50-17.40</th>
</tr>
</thead>

2 个答案:

答案 0 :(得分:0)

您可以将表的属性保持为display:none on page load,并且一旦单击该按钮,调用一个将使表显示的函数:block。

<input type="submit" name="submit" onclick="func()">
<table id="tbl" style="display:none">
...
</table>

<script>
function func(){
 document.getElementById('tbl').style.display = 'block';
}
</script>

如果需要,也可以使用jquery执行此操作。

答案 1 :(得分:0)

没有javascript或没有css是需要只检查$ _POST是否为空如果帖子不为空显示表

   <body>
    <div class="container">
    <h1>Faculty Timetable</h1>
    <br> 
    <form method="POST" action="<?php echo $_SERVER["PHP_SELF"]; ?>" >
    Enter Faculty Employee ID:<input type="text" name="FacEmployeeId">   
    <input type="submit" name="Submit">
    <br><br>
    <?php
    //$facid="";
if(!empty($_POST)){
    if($_SERVER["REQUEST_METHOD"]=="POST")
    $facid=$_POST['FacEmployeeId'];
    if(isset($facid)){
    echo "<p align='center'><b>Timetable for Faculty ID ". $facid ."<br></b>               `   `</p>";}
    ?>
    <br><br>
    <table id="table_id" class="table table-bordered">
    <thead>
    <tr>
    <th>         </th>
    <th>8.00-8.50</th>
    <th>9.00-9.50</th>
    <th>10.00-10.50</th>
    <th>11.00-11.50</th>
    <th>11.50-13.00</th>
    <th>13.00-13.50</th>
    <th>14.00-14.50</th>
    <th>14.55-.15.45</th>
    <th>15.50-16.40</th>
    <th>16.50-17.40</th>
    </tr>
    </thead>
<?php
}
?>