This is my code. I'm connecting to the server on localhost 8080 from the localhost and I get the error because its not the same origin. I looked at a lot of links which were useful but I don't know how to combine them with this code. Here are a few of the links I referred.
CORS - Cross-Domain AJAX Without JSONP By Allowing Origin On Server
https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
<!DOCTYPE html>
<html>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<form action="http://localhost:8080/newjersey/rest/hello" name="ajaxform" id="ajaxform" method="GET">
ID:<br>
<input type="text" name="ID">
<br>
Notes:<br>
<input type="text" name="notes">
<br><br>
Ignore:<br>
<input type="checkbox" name="ignore[]" value="1">Avg
<input type="checkbox" name="ignore[]" value="2">Time
<input type="submit" value="Submit">
</form>
<script>
//callback handler for form submit
$("#ajaxform").submit(function(e)
{
//$(this).addHeader("Access-Control-Allow-Origin", "*");
//alert("Its here");
var postData = $(this).serializeArray();
var formURL = $(this).attr("action");
//var formURL = "http://localhost:8080/newjersey/rest/hello/";
//alert(formURL);
$.ajax(
{
url : formURL,
type: "GET",
data : postData,
success:function(data, textStatus, jqXHR)
{
//data: return data from server
//alert("Success " + textStatus);
},
error: function(jqXHR, textStatus, errorThrown)
{
//if fails
}
});
e.preventDefault(); //STOP default action
$(this).unbind(e); //unbind. to stop multiple form submit.
});
$("#ajaxform").submit(); //Submit the FORM
</script>
</body>
</html>