<form id="fhome" method="POST" action="Page2.HTML" data-ajax="false">
<fieldset>
<div data-role="fieldcontain">
<label for="DD1" class="select">DD1:</label>
<select name="PJ" id="PJ">
<option value="Option 1">Option 1</option>
<option value="Option 2">Option 2</option>
</select>
<br />
<br />
<label for="DD2" class="select">DD2:</label>
<select name="Victim" id="Victim">
<option value="Option 3" >Option 3</option>
<option value="Option 4">Option 4</option>
</select>
<br />
<br />
<label for="mode7">Time :</label>
<input name="mode7" id="mode7" type="text" data-role="datebox" data-options='{"mode":"timeflipbox", "useNewStyle":true}' />
<br /><br />
</div>
<fieldset class="ui-grid-a">
<div class="ui-block-a savebtn"><button type="submit" data-theme="d" >Save</button></div>
<div class="ui-block-b"><button type="submit" data-theme="d" >Next</button></div>
</fieldset>
</fieldset>
</form>
以上是我的表格代码。现在,创建表单的方式,SAVE和NEXT按钮都导航到下一页。如何阻止我的表单导航到SAVE按钮上的下一页单击
答案 0 :(得分:1)
你必须使用Ajax,这个问题如下:
$("#ui-block-a input[type='submit']").click(function() {
var url = "Page2.HTML";
$.ajax({
type: "POST",
url: url,
data: $("#fhome").serialize(), // serializes the form's elements.
success: function(data)
{
alert(data); // show response from the php script.
}
});
return false;
});
答案 1 :(得分:0)
这是一个例子。这会将数据发送到parser.php文件,但不会刷新页面。
<script language="JavaScript" type="text/javascript">
function ajax_post(){
// Create our XMLHttpRequest object
var hr = new XMLHttpRequest();
// file thats saves your post data
var url = "parser.php";
//form data values
var name = document.getElementById("txt_name").value;
var surname = document.getElementById("txt_surname").value;
var vars = "name="+txt_name+"&surname="+txt_surname;
hr.open("POST", url, true);
// Set content type header information for sending url encoded variables in the request
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
// Access the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("status").innerHTML = return_data;
}
}
// Send the data to PHP now... and wait for response to update the status div
hr.send(vars); // Actually execute the request
document.getElementById("status").innerHTML = "processing...";
}
</script>