2010-04-08 25 views
5

Quando invio questo modulo, i valori scompaiono dalle caselle di testo. Mi piace che restino stampati nelle caselle di testo. Come lo faccio?come faccio a mantenere i dati del modulo dopo aver inviato il modulo utilizzando javascript?

<form id="myform" method="get" action="" onSubmit="hello();"> 

     <input id="hour" type="text" name="hour" style="width:30px; text-align:center;" /> : 
     <input id="minute" type="text" name="minute" style="width:30px; text-align:center;" /> 
     <br/> 
     <input type="submit" value="Validate!" /> 
    </form> 

    <style type="text/css"> 
    .error { 
     color: red; 
     font: 10pt verdana; 
     padding-left: 10px 
    } 
    </style> 
<script type="text/javascript"> 
function hello(){ 

    var hour = $("#hour").html(); 
    alert(hour); 
} 
    $(function() { 
     // validate contact form on keyup and submit 
     $("#myform").validate({ 
      //set the rules for the fild names 
      rules: { 
       hour: { 
        required: true, 
        minlength: 1, 
        maxlength: 2, 
        range:[0,23] 
       }, 
       minute: { 
        required: true, 
        minlength: 1, 
        maxlength: 2, 
        range:[0,60] 
       }, 
      }, 
      //set messages to appear inline 
      messages: { 
       hour: "Please enter a valid hour", 
       minute: "Please enter a valid minute" 
      } 
     }); 


    }); 
    </script> 
+0

dove vuoi mantenere i dati che cosa si vuole fare con i dati suppliche eexplain tua domanda in dettaglio. – Salil

+0

grazie per i commenti, quando invio il modulo sopra, i valori scompaiono dalle caselle di testo, mi piace che restino stampati nelle caselle di testo, come faccio? molte grazie – Lina

risposta

4

Quando si invia un modulo, l'intera pagina viene sostituita con la risposta dal server. Se si desidera rimanere sulla pagina (anziché sostituirla con la risposta), è possibile utilizzare jQuery.post o jQuery.ajax per inviare i dati del modulo al server anziché inviare effettivamente il modulo.

+0

Questo suona davvero interessante, io google un po 'per vedere come fare il jquery.post e darti un feedback – Lina

+2

@Lina: Stai attento a molti degli articoli "invia un modulo usando jQuery" che vedi lì, vedrai un sacco di cose come questa: 'var q ="? fname = "+ $ ('# firstNameField'). val() +" & lname = "+ $ ('# lastNameField'). val () ";' presentato come se fosse una buona cosa. Devi veramente * davvero * aver bisogno di codificare quei valori dei parametri tramite 'encodeURIComponent', non puoi semplicemente prenderli come in quel codice. (Pensa a cosa succederebbe se tu avessi un campo "nome azienda" e qualcuno ha inserito il valore "Foo & Bar Limited" - che '&' ha davvero bisogno di codifica.) Non è complicato, ma le persone lo perdono. Divertiti! –

+0

questo è un ottimo consiglio sempre apprezzato :) – Lina

9

Non appena si invia la pagina, i dati vengono inviati al server e viene caricata una nuova pagina. Nel tuo caso, questa è la stessa pagina di prima ma non fa la differenza per il browser. Per mantenere i valori, è necessario immettere i valori sul server durante il rendering della pagina.

In genere, è possibile copiare semplicemente i dati dai parametri di richiesta HTML nei campi.

+1

Di solito, * non * può semplicemente copiare i parametri di richiesta HTML nei campi. Esegui l'escape in formato HTML prima o la tua pagina sarà completamente aperta agli attacchi XSS. – Tomalak

+1

Eh? Quando leggi i parametri, il tuo framework HTML dovrebbe averli decodificati per te. Quando li scrivi, il tuo writer di output dovrebbe codificarli correttamente. Non vedo il tuo punto. –

0

È possibile utilizzare i cookie da JavaScript per mantenere i valori in. Fondamentalmente si accede a qualcosa chiamato document.cookie.

0

Ad esempio, per conservare i dati in un metodo di scrittura:

<input type="text" name="inputText" id="inputText" placeholder="Enter the name of your all-time favorite Duckbilled Platypus" value="@Request["inputText"]" autofocus style="display: inline-block;" /> 
0

Nel tag forma, comprendono onsubmit ="return false" evitare resettato forma. Ad esempio:??

<form name = "inputNumbers" onsubmit ="return false"> 
+0

Questo non funziona ... La funzione di invio è disabilitata in questo modo – MartinGGWW

Problemi correlati