Javascript form post to another page

Question

I am using jquery mobile for phonegap on an app I am making, so I am only allowed HTML, JavaScript, and CSS.(no PHP) I need to pass the input from a text box to the next page when they fill out the text area, I am just not sure how to do it in JavaScript without php.
//text input feild

<div data-role="fieldcontain"><label for="name-c">Enter Challenge:</label>
<input id="name-c" name="name" type="text" value="" /></div>

//button labels for selection

<div data-role="fieldcontain"><label class="select" for="select-choice-c">Challenge Type:</label> <select id="select-choice-c" name="select-choice-c"><option value="standard">Challenge</option><option value="rush">Public Challenge</option> </select></div>

Any help would be awesome! Thanks!

Answer 1

you have to use Jquery to do a more effective way I'll give you an example of how to do it:

Below is the Simple HTML Form.
    <form name="ajaxform" id="ajaxform" action="ajax-form-submit.php" method="POST">
        First Name: <input type="text" name="fname" value =""/> <br/>
        Last Name: <input type="text" name="lname" value ="" /> <br/>
        Email : <input type="text" name="email" value=""/> <br/>
    </form>

For jQuery Ajax Form Submit, we can use jQuery.ajax() or jQuery.post() method. To serialize form data, we can use jQuery.serialize() or jQuery.serializeArray().

//callback handler for form submit
$("#ajaxform").submit(function(e)
{
    var postData = $(this).serializeArray();
    var formURL = $(this).attr("action");
    $.ajax(
    {
        url : formURL,
        type: "POST",
        data : postData,
        success:function(data, textStatus, jqXHR) 
        {
            //data: return data from server
        },
        error: function(jqXHR, textStatus, errorThrown) 
        {
            //if fails      
        }
    });
    e.preventDefault(); //STOP default action
    e.unbind(); //unbind. to stop multiple form submit.
});

$("#ajaxform").submit(); //Submit  the FORM

Answer 2

Write your data in cookies or in the local storage of the browser.

After that you can access it on the other page.

Answer 3

Are any of these solutions acceptable?

http://www.gajotres.net/passing-data-between-jquery-mobile-pages/

I would advise against the local storage since there is a known "feature" that it is not accessible in any browser private browsing mode (html5 localStorage error with Safari: "QUOTA_EXCEEDED_ERR: DOM Exception 22: An attempt was made to add something to storage that exceeded the quota.")

Also I could consider cookies, but these can be manipulated. Depending on how sensitive your data is

http://www.javascripter.net/faq/settinga.htm