Как 2 HTML-формы могут совместно использовать 1 скрытое поле?

Question

У меня есть страница с 2 формами и скрытым полем, которое находится за пределами обеих форм.

Как скрытое поле можно отправить с помощью одной из форм?

Я думал о том, чтобы сделать что-то подобное с jQuery:

<script type="text/javascript">
    $(function() {
        $('form').submit(function() {
            // do something to move or copy the
            // hidden field to the submitting form
        });
    });
</script>

Будет ли это работать? Есть другие идеи?

ИЗМЕНИТЬ

Скрытое поле хранит сериализованный граф объектов, который не изменяется. Оба серверных метода требуют объекта. Строка сериализованного объекта может быть довольно здоровенной, поэтому я не хочу, чтобы эта вещь отправлялась с сервера 2 раза.

Answer 1

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

<Ч>

Примерно так:

<script type="text/javascript">
    $(function() {
        $('form').submit(function() {
            $("#hidden_element").clone().appendTo(this);
        });
    });
</script>

Если вы хотите использовать один и тот же элемент для обеих форм без создания новой копии, просто не используйте clone()

<Ч>

См. документацию по clone () и по appendTo ()

EDIT:

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

При загрузке страницы, что-то вроде этого:

$.post("page.php", { reallyBigObject : $("#hiddenfield").val() }, function(insertedID){
  $("#hiddenfield").val(insertedID);
});

Затем в коде на стороне сервера:

//insert $_POST["reallyBigObject"] into databse
//get the just inserted id (in php it's done with mysql_insert_id())
//echo, or print the just inserted id, and exit

Таким образом, ваш js получает обратный вызов.

Теперь вы можете отправить форму, как и раньше, но на этот раз вы отправляете на сервер только идентификатор (целое число). Затем вы можете просто удалить объект с вашего сервера (запустить cron, чтобы сделать это через X раз или отправить другой запрос на его удаление.

Честно говоря, если только вы не возражаете против ОГРОМНОГО (!!), я думаю, что сохранить его, отправив его только один раз, гораздо сложнее, чем просто отправить два запроса на сервер.

Дайте мне знать, если у вас есть другие вопросы ...

Answer 2

В HTML5 вы можете включить " form " атрибут с элементом ввода. Значением атрибута формы является идентификатор формы, к которой относится поле. Чтобы включить поле в несколько форм, включите все идентификаторы формы в список, разделенный пробелами. К сожалению, атрибут формы вообще не поддерживается в IE (начиная с IE 9). Поддержка FF и Chrome начинается в версиях 4 и 10 соответственно.

Answer 3

Добавить поле к обеим формам при загрузке страницы:

$(function() {
    $('#form1, #form2').append($('input[name=fieldName]'));
});

Answer 4

Предполагая, что вы делаете не AJAX-отправку, вы можете просто добавить поле в отправляемую форму. Однако если вам нужна эта информация в обеих формах, не лучше ли хранить эту сторону сервера значений в хранилище сеансов. Таким образом, все клиенты не JS также будут работать!

 $(function() {
        $('form').submit(function() {
             $('input.yourhiddenSubmit').appendTo(this);
        });
    });

Answer 5

Единственный способ передать переменную в следующую форму - это поместить эту переменную в данные, которые передаются при отправке формы (GET или POST), если только вы не хотите использовать AJAX. Предполагая, что вы хотите иметь скрытую переменную вне фактической формы для & Quot; веская причина & Quot; я бы порекомендовал использовать jQuery для включения скрытого поля ввода в форму непосредственно перед отправкой, например так:

<script type="text/javascript">
    $(function() {
        $('form').submit(function() {
            $(this).append("<input type='hidden' name='hiddenField' value='"+$("#hiddenField").val()+"' />");
            return true;
        });
    });
</script>

Заменить все экземпляры " hiddenField " с идентификатором вашего скрытого поля за пределами формы. Это создаст новый ввод внутри формы непосредственно перед ее отправкой со значением скрытого поля, которое находится в другом месте на странице.

Кроме того, вам нужно было бы немного более конкретно указать, в чем именно заключалась ваша проблема (и почему поле не включено в форму), чтобы я помог вам.

Обратите внимание, что приведенный выше код должен работать теоретически, но у меня не было возможности проверить его самостоятельно.