通过AJAX和PHP,提交JQuery Mobile表单
http://blog.itechol.com/space-4-do-blog-id-6533.html
File name: callajax.php
- <?php
- $firstName=$_POST[firstName];
- $lastName=$_POST[lastName];
- echo("FirstName:".$firstName."LastName:".$lastName);
- ?>
File name: index.php
- <!DOCTYPEhtml>
- <html>
- <head>
- <title>SubmitaformviaAJAX</title>
- <linkrel="stylesheet"href="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.css"/>
- <scriptsrc="http://code.jquery.com/jquery-1.5.2.min.js"></script>
- <scriptsrc="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.js"></script>
- </head>
- <body>
- <script>
- functiononSuccess(data,status)
- {
- data=$.trim(data);
- $("#notification").text(data);
- }
- functiononError(data,status)
- {
- //handleanerror
- }
- $(document).ready(function(){
- $("#submit").click(function(){
- varformData=$("#callAjaxForm").serialize();
- $.ajax({
- type:"POST",
- url:"callajax.php",
- cache:false,
- data:formData,
- success:onSuccess,
- error:onError
- });
- returnfalse;
- });
- });
- </script>
- <!--callajaxpage-->
- <divdata-role="page"id="callAjaxPage">
- <divdata-role="header">
- <h1>CallAjax</h1>
- </div>
- <divdata-role="content">
- <formid="callAjaxForm">
- <divdata-role="fieldcontain">
- <labelfor="firstName">FirstName</label>
- <inputtype="text"name="firstName"id="firstName"value=""/>
- <labelfor="lastName">LastName</label>
- <inputtype="text"name="lastName"id="lastName"value=""/>
- <h3id="notification"></h3>
- <buttondata-theme="b"id="submit"type="submit">Submit</button>
- </div>
- </form>
- </div>
- <divdata-role="footer">
- <h1>GiantFlyingSaucer</h1>
- </div>
- </div>
- </body>
- </html>
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
jQuery mobile 表单提交
http://blog.csdn.net/tjpu_lin/article/details/28394253
最近在做手机页面用jQuery mobile开发,在用到form表单提交到时遇到了问题。
后台是用servlet进行处理的,想通过Servlet里面的重定向进行页面跳转发现在手机上根本没有用,出现errorpage提示信息。
查询网上资料以及jQuery mobile API得知jQuery mobile表单提交默认是ajax提交,所以页面跳转写在servlet里面根本就不会实现页面跳转功能。
于是我按照教程在form里面加了 data-ajax=“false”这一属性,发现别说是页面跳转不行,就连后台的数据库操作都做不了,报了500错误。
想了好久既然用ajax提交,那么就用ajax进行页面跳转
- <scripttype="text/javascript">
- $(document).ready(function(){
- $("#submitbtn").click(function(){
- cache:false,
- $.ajax({
- type:"POST",
- url:"feedback",
- data:$('#feedbackform').serialize(),
- success:function(data){
- $.mobile.changePage("success.html");
- }
- });
- });
- });
- </script>
- <formmethod="post"id="feedbackform">
- t;spanstyle="white-space:pre"></span>//相关表单元素
- <inputtype="button"id="submitbtn"value="提交">
- </form>
注意的是js里面的data
- $('#feedbackform').serialize()