javascript - Getting localstorage data when second page loads -
javascript - Getting localstorage data when second page loads -
i new phonegap. trying localstorage info stored in firstpage on sec page. not getting alert "hello", when secondpage loads. running on ios simulator.
<html> <head> <title>submit form via ajax</title> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.css" /> <script src="http://code.jquery.com/jquery-1.5.2.min.js"></script> <script src="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.js"></script> </head> <body> <script> function onsuccess(data, status) { info = $.trim(data); //$("#notification").text(data); alert(data); console.log(data); if(data=="success"){ // store info var username = $("#username").val(); var email = $("#email").val(); // store info localstorage.setitem('username',$("#username").val()); localstorage.setitem('email',$("#email").val()); //change page $.mobile.changepage("#secondpage"); } } function onerror(data, status) { // handle error } $(document).ready(function(){ $("#submit").click(function(){ callajax(); homecoming false; }); $("#secondpage").on("pageshow", function (event) { alert("hello"); $("#username").text(localstorage.getitem("username")); $("#email").text(localstorage.getitem("email")); }); }); function callajax() { var formdata = $("#callajaxform").serialize(); $.ajax({ type: "post", url: “myurl”, cache: false, data: formdata, success: onsuccess, error: onerror }); } </script> <!-- phone call first page --> <div data-role="page" id="firstpage"> <div data-role="header"> <h1>call ajax</h1> </div> <div data-role="content"> <form id="callajaxform"> <div data-role="fieldcontain"> <label for="username">user name</label> <input type="text" name="username" id="username" value="" /> <label for="lastname">last name</label> <input type="text" name="lastname" id="lastname" value="" /> <label for="email">email</label> <input type="text" name="email" id="email" value="" /> <label for="password">password</label> <input type="password" name="password" id="password" value="" /> <button data-theme="b" id="submit" type="submit">submit</button> </div> </form> </div> <div data-role="footer"> <h1>footer</h1> </div> </div> <!-- phone call sec page --> <div data-role="page" id="secondpage"> <div data-theme="a" data-role="header"> <h3> sec page </h3> </div> <div data-role="content" id="content2"> <label for="username">user name</label> <input type="text" name="username" id="username" value="" /> <label for="lastname">last name</label> <input type="text" name="lastname" id="lastname" value="" /> <label for="email">email</label> <input type="text" name="email" id="email" value="" /> </div> </div> </body> </html>
i've pasted finish code above.
i pretty much sure sure ajax phone call doesn't work. have give valid url. hence rmoved it. seek code.
<body> <script> $(document).ready(function(){ $("#submit").click(function(){ var username = $("#username").val(); var email = $("#email").val(); // store info window.localstorage["username"]="ss" window.localstorage["username"] = $("#username").val(); window.localstorage["username"] = $("#email").val(); //change page $.mobile.changepage("#secondpage"); homecoming false; }); $("#secondpage").on("pageshow", function (event) { alert(window.localstorage["username"]); $("#secondpage").find("#username").val( window.localstorage["username"] ); $("#secondpage").find("#email").val( window.localstorage["username"] ); }); }); </script> <!-- phone call first page --> <div data-role="page" id="firstpage"> <div data-role="header"> <h1>call ajax</h1> </div> <div data-role="content"> <form id="callajaxform"> <div data-role="fieldcontain"> <label for="username">user name</label> <input type="text" name="username" id="username" value="" /> <label for="lastname">last name</label> <input type="text" name="lastname" id="lastname" value="" /> <label for="email">email</label> <input type="text" name="email" id="email" value="" /> <label for="password">password</label> <input type="password" name="password" id="password" value="" /> <button data-theme="b" id="submit" type="submit">submit</button> </div> </form> </div> <div data-role="footer"> <h1>footer</h1> </div> </div> <!-- phone call sec page --> <div data-role="page" id="secondpage"> <div data-theme="a" data-role="header"> <h3> sec page </h3> </div> <div data-role="content" id="content2"> <label for="username">user name</label> <input type="text" name="username" id="username" value="" /> <label for="lastname">last name</label> <input type="text" name="lastname" id="lastname" value="" /> <label for="email">email</label> <input type="text" name="email" id="email" value="" /> </div> </div> </body>
javascript ios html5 cordova
Comments
Post a Comment