Form to perform action and passover the values

问题

Hi i basically have a form that has a two textboxes which will send the data back to the google spreadsheet, as i have attached my form to the google form, if u know how to do this then its ok, if not u can take a look here http://www.morningcopy.com.au/tutorials/how-to-style-google-forms/lets call them,

<form action="LINK TO GOOGLE SPREAD SHEET LINK" method="post">
<input type="text" id="tb1" name="tb1"/>
<input type="text" id="tb2" name="tb2"/>
<input type="submit" value="submit"/>
</form>

So my question is once the data is submitted I want to get the textbox2.value to be passed over to the next page lets call it page2.html, so the previous tb2.value is passed over to page2.html textbox1.value. I also know how to navigate to the next page so that is not the issue the issue is how to get the value from tb2 and also submit the form at the same time. TKS been struggling to get this done.

<form action="LINK TO GOOGLE SPREAD SHEET LINK" method="post">
<input type="text" id="tb1" name="tb1"/>
<input type="text" id="tb2" name="tb2"/>
<input type="submit" value="submit"/>


</form>

SO I HAVE MODIFIED TO LOOK AS BELOW 
For the first page is this its name is Testhtml.html


    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>TEsthtml.html</title>
    </head>

    <body>

    <iframe name="response_iframe" id="hidden_iframe" style="display:none;" onload="if(submitted){window.location='simple.html';}"></iframe>
    <form action="https://docs.google.com/spreadsheet/formResponse?formkey=dDN5RE9ueU9HRGdQYzlJYWhrRUY1UEE6MQ&ifq" target="response_iframe" onSubmit="submitted=true;" method="POST">
    <label  for="entry_0">Type ur name</label>
    <input type="text" name="entry.0.single" value=""  id="entry_0">
    <br> 
    <label  for="entry_1">ur pets name
    </label>
    <label  for="entry_1">type something</label>
    <input type="text" name="entry.1.single" value=""  id="entry_1">
    <br>
    <input type="submit" name="submit" value="Submit">
    <script type="text/javascript">
    $(document).ready(function () {
        $('commentForm').submit(function () {
            var tb2_val = $('input#entry_1', $(this)).val();
            // do something with tb2_val
    localStorage.setItem('hpnumber', tb2_val);
            // return false; // uncommenting this will prevent the submit action
        });
    });

    </script>
    </form>
    </body>
    </html>

THE SECOND PAGE IS THIS its name is simple.html

 <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Simple HTML</title>
    <script type="text/javascript">
    $(document).ready(function () {
        var thevalue = localStorage.getItem("hpnumber")
        $('form').find('input#tb1').val(thevalue);
    });

    </script>
    </head>

    <body>
    <script type="text/javascript">
    $(document).ready(function () {
        var thevalue = localStorage.getItem("hpnumber")
        $('form').find('input#tb1').val(thevalue);
    });

    </script>
    <input id="tb1" name="tb1" type="text"/>


    </body>
    </html>

but still not working while the data is able to submit and the second page the simple.html is opening up with the textbox value set to nothing just blank..please help with this tks. BTW u can c that the data is being update in the google spreadsheet whenever u press submit button, the spreadsheet is made public here you go.. https://docs.google.com/spreadsheet/ccc?key=0AqUqEITRLZjYdDN5RE9ueU9HRGdQYzlJYWhrRUY1UEE

回答1:

To get the form values on submit, just use

$(document).ready(function () {
    $('form').submit(function () {
        var tb2_val = $('input#tb2', $(this)).val();
        // do something with tb2_val

        // return false; // uncommenting this will prevent the submit action
    });
});

As far as passing values between pages, you'll have to determine how you'll handle that (cookies, url parameters, store to db/retrieve from db, html5 local storage, etc). Once you determine your method, grab the value and do

$(document).ready(function () {
    var thevalue = ///
    $('form').find('input#tb1').val(thevalue);
});

来源：https://stackoverflow.com/questions/8577859/form-to-perform-action-and-passover-the-values

标签

javascript

jquery

html

google-docs