Form Submission
Form submission
HTML
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css">
<div data-role="page" id="page1" data-theme="a">
<div data-role="content" id="content1" name="content1">
<form id="form1" >
<div id="text1" data-role="fieldcontain">
<label for="text1">Text1:</label>
<input id="text1" name="text1" type="text" />
</div>
<div id="text2" data-role="fieldcontain">
<label for="text2">Text2:</label>
<input id="text2" name="text2" type="text" />
</div>
<div id="submitDiv" data-role="fieldcontain">
<button name="submitbtn" type="submit" id="submitbtn" />submit</button>
</div>
</form>
<div id="responsediv"></div>
</div>
</div>
</div>
JavaScript
$('#form1').submit(function(e) {
console.log("submit handler");
console.log(e);
e.preventDefault();
e.stopPropagation();
$.mobile.loadPage("/echo/html",{
type: "post",
data: $("#form1").serialize(),
pageContainer: $("#responsediv")
});
});
new Request.HTML({
url: '/echo/html/',
data: {
html: "<p>Text echoed back to request</p>" + "<script type='text/javascript'>$('target').highlight();<\/script>",
delay: 3
},
method: 'post',
update: 'target'
}).send();