Показать таблицу при отправке формы

Question

У меня есть форма, если ничего не отправлено, то она не должна отображать таблицу #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>

Answer 1

Убедитесь, что ваша таблица с идентификатором mytable скрыта (используйте display: none или что-то подобное), затем используйте этот jQuery:

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

Обратите внимание, что это предотвращает обработку действия формы (т. Е. Отправку на ваш сервер).

Answer 2

Вы можете использовать атрибут 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
}

Это предполагает, что таблица изначально скрыта.

Надеюсь, это поможет

Answer 3

То есть вы хотите иметь возможность изменить свою страницу после обычной отправки, ничего не делая на сервере?Я не думаю, что вы можете (если вы делаете обычное сообщение).

Обычное сообщение вызовет навигацию, поэтому вы потеряете свое текущее состояние на стороне клиента.Это делает большинство предложений здесь неправильными, я думаю.Таким образом, вам придется делать это на стороне клиента прямо при загрузке страницы.На этом этапе вам нужно знать, был ли он загружен в результате публикации или обычного первого раунда.Я не думаю, что вы можете сделать это, не помещая что-то в бэкэнд.

Конечно, вы можете отправлять сообщения через ajax.Это не вызовет навигацию, и тогда вы можете просто отобразить таблицу на стороне клиента.Визуализируйте таблицу с display:none, установленным для его стиля, затем используйте jQuery('#myTable').show();

Answer 4

Прежде всего, присвойте "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"
}

Answer 5

Самый простой способ сделать это - использовать свой бэкэнд-код. Какой язык вы используете?

Если вы хотите сделать это на стороне клиента, вам нужно добавить параметр запроса в свой атрибут действия, чтобы при перезагрузке страницы вы могли видеть, была ли опубликована форма.

Как вы отправляете свою форму? Вы хотите опубликовать свои данные через форму или AJAX? Пожалуйста, уточните немного.

.. Фредрик

Answer 6

Вы можете использовать язык на стороне сервера, чтобы проверить переменную post или get и, если она существует, включить таблицу в html.
Вы также можете сделать что-нибудь с JavaScript и куки. http://plugins.jquery.com/project/cookie