提交表单时显示表

时间:2010-08-11 09:22:15

标签: javascript jquery html css forms

我有一个表单,如果没有提交,那么它不应该显示表#mytable 只有在提交表单时才应显示表#mytable

我该怎么做?

<form action="" id="myform" method="get">
   <strong>Søg på fritekst :</strong>
   <input type="text" name="searchword" id="searchword" value=""/>
   <input type="submit" id="show" value="Søg"/>
</form>


<table width="100%" id="mytable" class="sortable" border="0" cellpadding="2" cellspacing="2" style="border:1px solid #D4D4D4;">
<tr>
<th bgcolor="#313c95" width="100" style="color: #FFF; font-weight:bold; text-align: left;">EAK Kode:</th>
<th bgcolor="#313c95" width="350" style="color: #FFF; font-weight:bold; text-align: left;">Beskrivelse:</th>
<th style="display:none;"></th>
<th style="display:none;"></th>
<th style="display:none;"></th>

</tr>
</table>

6 个答案:

答案 0 :(得分:3)

确保隐藏了标识为mytable的表格(使用display: none或类似内容),然后使用此jQuery:

$('#myform').submit(function() {
  $('#mytable').show();
  return false;
});

请注意,这会阻止正在处理的表单操作(即POST到您的服务器)。

答案 1 :(得分:1)

您可以使用表单中的onsubmit属性来运行javascript函数:

<form ... onsubmit="return showTable();">

然后有一个javascript函数

function showTable()
{
    document.getElementById('mytable').style.visibility = 'visible';//shows the table
    return false; //tells the form not to actaully load the action page
}

假设该表最初是隐藏的。

希望有所帮助

答案 2 :(得分:0)

您可以使用服务器端语言来检查帖子或获取变量,如果它存在则包含html中的表格。
你也可以用javascript和cookies做点什么。 http://plugins.jquery.com/project/cookie

答案 3 :(得分:0)

最简单的方法是使用后端代码。你用的是哪种语言?

如果您想在客户端进行操作,则需要在操作属性中添加查询参数,以便在页面重新加载时可以查看表单是否已发布。

您是如何提交表格的?您想通过表单或AJAX发布您的数据吗?请详细说明一下。

..弗雷德里克

答案 4 :(得分:0)

首先,将"display:none"分配到您的表中,就像编码一样。

<form action="" id="myform" method="get">
    <strong>
        Søg på fritekst : 
    </strong>
    <input type="text" name="searchword" id="searchword" value=""/>
    <input type="submit" id="show" value="Søg"/>
</form>
<table width="100%" id="mytable" class="sortable" border="0" cellpadding="2" cellspacing="2" style="border:1px solid #D4D4D4; display:none;">
    <tr>
        <th bgcolor="#313c95" width="100" style="color: #FFF; font-weight:bold; text-align: left;">
            EAK Kode: 
        </th>
        <th bgcolor="#313c95" width="350" style="color: #FFF; font-weight:bold; text-align: left;">
            Beskrivelse: 
        </th>
        <th style="display:none;">
        </th>
        <th style="display:none;">
        </th>
        <th style="display:none;">
        </th>
    </tr>
</table>

提交后,请执行以下编码。

function showTable()
{
    document.getElementById('mytable').style.display = "inline"
}

答案 5 :(得分:0)

因此,您希望能够在正常提交后更改页面而无需在服务器上执行任何操作吗?我认为你不能(如果你正在做一个正常的帖子)。

普通帖子会导致导航,因此您将失去当前的客户端状态。我认为,这使得大多数建议都不正确。因此,在加载页面时,您必须在客户端右侧执行此操作。此时,您需要知道它是由于帖子或正常的第一轮获取而加载的。如果不在后端放置任何东西,我认为你不能做到这一点。

当然,你可以通过ajax提交。这不会导致导航,然后您可以只显示客户端表。使用display:none为其样式设置表格,然后使用jQuery('#myTable').show();