Instead of having the form submit your request have your checkForm routine make the calls separately using ajax? You can then combine the results for whatever display you are doing. Remember to have checkForm return false;
I'd noticed you hadn't accepted an answer yet and that mine was vague. If what you want to do is collect data from two sources using GET for one and POST for the other, you can do that. I'm including a sample javascript using ajax. When you click your button the checkForm function will send a POST request and, when it completes, send a GET to a second service. The results can be combined and it will look to the user as though its one operation. This is working code (although, of course, you will have to adapt it to your services).
<?xml version="1.0" encoding="ISO-8859-1" ?>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Form</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript">
var postData = null;
$(document).ready(function() {
$("#formDiv").show();
$("#tableDiv").hide();
});
function checkForm()
{
postData = $("#Search_Form").serialize();
alert(postData);
$.ajax({
type: "POST",
url: "http://localhost:8080/FirstAjaxJspTest/AjaxService",
data: postData, // form's input turned to parms
contentType: "text",
success: function(data)
{
tableBuild(data);
},
complete: function(data) {
nextAjaxCall();
},
failure: function(msg)
{
alert("Failure: " + msg);
}
});
return false;
}
function nextAjaxCall()
{
$.ajax({
type: "GET",
url: "http://localhost:8080/FirstAjaxJspTest/AjaxService",
data: postData, // form's input turned to parms
contentType: "text",
success: function(data) {
tableBuild(data);
tableDisplay();
},
failure: function(msg) {
alert("Failure: " + msg);
}
});
return false;
}
function tableBuild(data)
{
data.forEach(function(entry) {
$("#resultsTable").append($("<tr><td>" + entry.name + "</td><td>" + entry.address + "</td></tr>"));
});
return;
}
function tableDisplay()
{
$("#formDiv").hide();
$("#tableDiv").show();
return;
}
</script>
</head>
<body>
<div id="formDiv">
<form id="Search_Form">
Name:<br/>
<input type="text" id="name" name="name" /><br/>
SSN:<br/>
<input type="text" id="ssn" name="ssn" /><br/><br/>
<button type="button" onclick="return checkForm()">Submit</button>
</form>
</div>
<div id="tableDiv">
<table id="resultsTable">
<thead>
<tr>
<th>Name</th>
<th>Address</th>
</tr>
</thead>
</table>
</div>
</body>
</html>