Como pode 2 formulários HTML compartilhar um campo escondido?

Question

Eu tenho uma página com 2 formas e um campo oculto que está fora de ambas as formas.

Como o campo oculto pode ser submetido a qualquer das formas?

Eu pensei em fazer algo como isso com jQuery:

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

Will este trabalho? Quaisquer outras ideias?

Editar

As lojas campo oculto um gráfico do objeto serializado que não muda. Ambos os métodos de servidores exigem o objeto. A seqüência de objeto serializado pode ficar muito pesado, então eu não quero essa coisa enviado do servidor 2 vezes.

Answer 1

Você pode simplesmente injetar uma cópia do elemento em cada forma correta antes da submissão. Dessa forma, você pode ter a opção de ter informações diferentes para cada campo de formulário ocultos sem afetar o outro.

---

Algo parecido com isto:

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

Se você quiser usar o mesmo elemento exata para ambas as formas, sem criar uma nova cópia, só não use clone()

---

Veja a documentação para clone () e para appendTo ()

EDIT:

Se você não quiser enviar o elemento escondido com cada pedido a forma envia. Considere armazená-lo no banco de dados para esse usuário para a época. Você pode enviar o seu conteúdo uma vez, e apenas uma vez para cada recarregamento da página, e em seguida, basta enviar a ID de banco de dados do elemento escondido com cada post formulário.

No carregamento da página, algo como isto:

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

Em seguida, no código do lado do servidor:

//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

Desta forma, seus js recebe o retorno de chamada.

Agora, você pode enviar o formulário como faria, mas desta vez, você está enviando apenas o id (número inteiro) para o servidor. Você pode então simplesmente excluir o objeto de seu servidor (executar um cron para fazê-lo depois de X quantidade de tempo, ou enviar um outro pedido para excluí-lo.

Honestamente, porém, a menos que você se oponha é enorme (!!), eu acho que armazená-lo submetendo-o apenas uma vez é muito mais complexo para executar do que simplesmente enviar dois pedidos para o servidor.

Deixe-me saber se você tiver quaisquer outras perguntas ...

Answer 2

Com HTML5, você pode incluir um atributo "forma" com um elemento de entrada. O valor do atributo forma é a ID da forma (s) o campo pertence. Para incluir o campo em mais de uma forma, incluir todos os ids de formulário em uma lista delimitada por espaço. Infelizmente, o atributo forma não é suportado no IE de todo (como de IE 9). FF e Chrome apoio início na versão 4 e 10, respectivamente.

Answer 3

Acrescentar o campo para ambas as formas no carregamento da página:

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

Answer 4

Assumindo que você está fazendo um não ajax enviar você poderia simplesmente anexar o campo no formulário que está sendo submetido. No entanto, se você precisa esta informação em ambas as formas não é melhor para armazenar esse lado do servidor valor em uma loja de sessão. Desta forma qualquer não js clientes também vai trabalho!

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

Answer 5

A única maneira de passar a variável para a próxima forma é ter essa variável nos dados que são passados ??quando o formulário é enviado (GET ou POST), a menos que você quiser usar AJAX. Supondo que você quer ter o lado de fora variáveis ??ocultas da forma real para uma "boa razão", eu recomendo usar jQuery para incluir o campo de entrada oculto no formulário apenas antes da apresentação, assim:

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

Substitua todas as ocorrências de "hiddenField" com o ID do seu campo oculto fora do formulário. Isto irá criar um novo interior de entrada do formulário apenas antes de ser enviado com o valor do campo oculto que está em outro lugar na página.

Além disso, você teria que ser um pouco mais específico sobre o que o seu problema exato era (e porque o campo não está sendo incluído no formulário) para me ajudar.

Note que o código acima deve funcionar na teoria, mas eu não tive a chance de realmente testá-lo eu mesmo.