In che modo 2 moduli HTML possono condividere 1 campo nascosto?

Question

Ho una pagina con 2 moduli e un campo nascosto esterno a entrambi i moduli.

Come si può inviare il campo nascosto con uno dei moduli?

Ho pensato di fare qualcosa del genere con jQuery:

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

Funzionerà? Altre idee?

Modifica

Il campo nascosto memorizza un grafico ad oggetti serializzato che non cambia. Entrambi i metodi del server richiedono l'oggetto. La stringa di oggetti serializzata può diventare piuttosto pesante, quindi non voglio che questa cosa venga inviata dal server 2 volte.

Answer 1

Puoi semplicemente iniettare una copia dell'elemento in ogni modulo subito prima dell'invio. In questo modo, puoi avere la possibilità di avere informazioni diverse per ciascun campo del modulo nascosto senza influire sull'altro.

---

Qualcosa del genere:

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

Se vuoi usare lo stesso identico elemento per entrambi i moduli senza creare una nuova copia, non usare clone()

---

Consulta la documentazione per clone () e per appendTo ()

EDIT:

Se non si desidera inviare l'elemento nascosto con ogni richiesta inviata dal modulo. Prendi in considerazione di memorizzarlo nel database per quell'utente per quel tempo. Puoi inviare il suo contenuto una sola volta, e una sola volta per ogni ricarica della pagina, quindi inviare semplicemente l'id del database dell'elemento nascosto con ogni post del modulo.

Al caricamento della pagina, qualcosa del genere:

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

Quindi, nel codice lato server:

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

In questo modo il tuo js ottiene il callback.

Ora puoi inviare il modulo come faresti, ma questa volta invii solo l'id (numero intero) al server. Puoi quindi semplicemente eliminare l'oggetto dal tuo server (esegui un cron per farlo dopo X tempo o invia un'altra richiesta per eliminarlo.

Onestamente, però, a meno che non ti opponga a ENORME (!!), penso che memorizzarlo inviandolo solo una volta sia molto più complesso da eseguire rispetto al semplice invio di due richieste al server.

Fammi sapere se hai altre domande ...

Answer 2

Con HTML5, puoi includere un " form " attributo con un elemento di input. Il valore dell'attributo form è l'id delle form a cui appartiene il campo. Per includere il campo in più di un modulo, includere tutti gli ID modulo in un elenco delimitato da spazi. Sfortunatamente, l'attributo form non è affatto supportato in IE (a partire da IE 9). Il supporto di FF e Chrome inizia rispettivamente nella versione 4 e 10.

Answer 3

Aggiungi il campo ad entrambi i moduli al caricamento della pagina:

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

Answer 4

Supponendo che tu stia effettuando un invio non ajax, potresti semplicemente aggiungere il campo nel modulo da inviare. Tuttavia, se sono necessarie queste informazioni in entrambe le forme, non è meglio archiviare questo lato server di valore in un archivio sessioni. In questo modo funzionerà anche qualsiasi client non js!

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

Answer 5

L'unico modo per passare la variabile al modulo successivo è di avere quella variabile nei dati che vengono passati quando il modulo viene inviato (GET o POST), a meno che non si desideri utilizzare AJAX. Supponendo di voler avere la variabile nascosta al di fuori del modulo effettivo per un & Quot; buon motivo & Quot ;, consiglierei di usare jQuery per includere il campo di input nascosto nel modulo appena prima dell'invio, in questo modo:

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

Sostituisci tutte le istanze di " hiddenField " con l'ID del campo nascosto al di fuori del modulo. Ciò creerà un nuovo input all'interno del modulo appena prima che venga inviato con il valore del campo nascosto che si trova altrove nella pagina.

Oltre a ciò, dovresti essere un po 'più specifico su quale fosse il tuo esatto problema (e perché il campo non è stato incluso nel modulo) per aiutarmi.

Nota che il codice sopra dovrebbe funzionare in teoria, ma non ho avuto la possibilità di provarlo da solo.