问题
I am creating a page in jsp. Basically converting my html design into jsp page.Using Apache tomcat as a server.
My problem is I am trying to load a result page through Ajax call on form submit.I am getting "Error: Precondtion Failed" error.
Could any one resolve this error.
My code as follows
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="./css/asp.css"/>
<script type="text/javascript" src="./js/jquery-1.7.1.min.js" charset="utf-8"></script>
<title>Authorize Service Provider Search Page</title>
<script>
$(document).ready(function(){
$("form").submit(function(e) {
alert("hello");
e.preventDefault();
$.ajax({
type: "POST",
url: "aspSearchResultPage.html",
success: function()
{
$("#information").load("aspSearchResultPage.html");
},// success
error : function(xhr, textStatus, errorThrown) {
alert("Error: " + (errorThrown ? errorThrown : xhr.status));
}
});
return false;
});
});
</script>
</head>
<body class="COMPO">
<!-- Wrapper -->
<div id="wrapper">
<!-- Container -->
<div id="container" class="resolution_800x600">
<!-- Colonnage -->
<div id="colonnes" class="clear">
<!-- Page title -->
<h2 class="title_n1_orange">ASP Search Page</h2>
<!--/Page title-->
<!-- Form Page-->
<div class="form">
<form name="asp_search_page" id="form_asp_search_id" action="" method="post">
<p class="mandatory">Fields marked with asterisks (<span class="mandatory_code">*</span>) are mandatory.</p>
<table class="tables" summary="ASP Search Page" cellpadding="0" cellspacing="3">
<tbody>
<!-- First Row -->
<tr>
<th scope="row"><label for="asp">ASP <b>:</b></label></th>
<td><select id="asp" name="asp" class="field_size_e"><!--<optgroup label="Groupe 1">--><option value="ABC">ABC</option><option value="DEF">DEF</option><option value="GHI">GHI</option><option value="JKL">JKL</option><!--</optgroup><optgroup label="Groupe 2">--><!--</optgroup>--></select></td>
<th scope="row" colspan="2"><label for="region">Region <b>:</b></label></th>
<td><select id="region" name="region" class="field_size_e"><!--<optgroup label="Groupe 1">--><option value="ABC">APAC</option><option value="DEF">AME</option><option value="GHI">EUMA</option><!--</optgroup><optgroup label="Groupe 2">--><!--</optgroup>--></select>
</td>
<th scope="row" colspan="3"><label for="asp">Cluster <b>:</b></label></th>
<td><select id="cluster" name="cluster" class="field_size_e"><!--<optgroup label="Groupe 1">--><option value="ABC">INDIA&CHINA</option><option value="DEF">CHINA&JAPAN</option><option value="GHI">INDIA&HONGKONG&JAPAN</option><option value="JKL">UNITED STATES&CHILE</option><option value="MNO">CANNADA & BRAZIL</option><option value="PQR">DENMARK&EGYPT&FINLAND</option><option value="STU">EGYPT&FRANCE</option><!--</optgroup><optgroup label="Groupe 2">--><!--</optgroup>--></select>
</td>
</tr>
<!--/First Row-->
<!-- Second Row -->
<tr>
<th scope="row"><label for="asp">Country <b>:</b>
</label>
</th>
<td><select id="country" name="country" class="field_size_e"><!--<optgroup label="Groupe 1">--><option value="ABC">INDIA</option><option value="DEF">CHINA</option><option value="GHI">FRANCE</option><option value="JKL">PARIS</option><option value="MNO">EGYPT</option><option value="PQR">CARIO</option><option value="STU">BRAZIL</option><option value="VWX">CANNADA</option><!--</optgroup><optgroup label="Groupe 2">--><!--</optgroup>--></select></td>
<th scope="row" colspan="2"><label for="asp">SSC
Support <b>:</b> </label>
</th>
<td><select id="cluster" name="cluster" class="field_size_e"><!--<optgroup label="Groupe 1">--><option value="ABC">ABC</option><option value="DEF">DEF</option><option value="GHI">GHI</option><option value="JKL">JKL</option><!--</optgroup><optgroup label="Groupe 2">--><!--</optgroup>--></select>
</td>
<th scope="row" colspan="3"><label title="Oracle_Code" for="Oracle_Code">Oracle Code <b>:</b>
</label>
</th>
<td><input maxlength="10" name="Oracle_Code" id="Oracle_Code_id" class="field_size_e" type="text" />
</td>
</tr>
<!--/Second Row-->
<!-- Third Row -->
<tr>
<th scope="row"><label title="CC_ID" for="CC_ID">Clarify
Contract ID <b>:</b>
</label>
</th>
<td><input maxlength="10" name="CC_ID" id="CC_ID" class="field_size_e" type="text" /></td>
</tr>
<tr><td> </td></tr>
<!--/Third Row-->
<!-- Fourth Row -->
<tr>
<td colspan="2"> </td>
<td colspan="2">
<button type="submit" class="button_action_standard">
<span>Search</span>
</button></td>
<td>
<button type="reset" class="button_action_standard">
<span>Reset</span>
</button>
</td>
</tr>
<!--/Fourth Row-->
</tbody>
</table>
</form>
<!-- Content to be displayed-->
<div id="information"></div>
<!--/Content to be displayed-->
</div>
<!--/Form-->
</div>
<!--/Colonnage-->
</div>
<!--/container-->
</div>
<!--/wrapper-->
</body>
</html>
回答1:
@Priya I hope you are using struts. Send your request via action and forward the request to the jsp page which you needs to be loaded. Return the same jsp page as response as data (here) and fill your div with that data. Find the code snippet below for your purpose. You need to modify the code according to your needs.
$.ajax({
url : "yourAction.do?method=yourMethod",
type : "POST",
async : false,
success : function(data) {
$("#information").html(data);
}
});
Let me know if this helps..
来源：https://stackoverflow.com/questions/19086665/ajax-precondition-failed-error