Blank template application for JSON requests with and without body:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>My Blank JS / jQuery app - jsFiddle demo by jorooo</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-latest.js'></script>
<!--link rel="stylesheet" type="text/css" href="/css/result-light.css"-->
<script type='text/javascript' src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css">
<style type='text/css'>
</style>
</head>
<body>
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
$("#alert").bind("click", function(event) {
alert('alert called');
});
$("#call_json_with_body").bind("click", function(event) {
$.ajax({
success: function( data ){
alert("success");
alert('success, data received is ' + JSON.stringify(data));
},
error: function( jqXHR, textStatus, errorThrown ){
alert( "error while making ajax call. Error parameters are, " +
"\ntextStatus: " + textStatus +
";\n errorThrown: " + errorThrown +
";\n jqXHR: " + JSON.stringify(jqXHR) );
},
beforeSend: function(req) {
req.setRequestHeader("Accept", "application/json");
req.setRequestHeader("Content-Type","application/json");
},
dataType: 'json',
data: JSON.stringify( {"zzz":"222"} ),
type: 'POST',
cache: false,
url: "http://localhost:8080/add_venue_raw",
}
);
});
$("#call_json_without_body").bind("click", function(event) {
$.ajax({
success: function( data ){
alert("x");
alert('success, data received is ' + JSON.stringify(data) );
},
error: function( jqXHR, textStatus, errorThrown ){
alert( "error while making ajax call. Error parameters are, " +
"\ntextStatus: " + textStatus +
";\n errorThrown: " + errorThrown +
";\n jqXHR: " + JSON.stringify(jqXHR) );
},
type: 'GET',
cache: false,
url: "http://localhost:8080/user/1",
}
);
});
});//]]>
</script>
<div data-role="page" id="p1">
<div data-role="header"><h1>Header</h1></div>
<div data-role="content">
<h5>If the script is running from a file:/// URL you could experience some issues. It's best not to do AJAX requests from file URLs, because they are treated inconsistently. Chrome, for example, entirely disallows them. Firefox also.</h5>
<a href="#" id="call_json_without_body" data-role="button">JSON request without body</a><br/>
<a href="#" id="call_json_with_body" data-role="button">JSON request with body</a><br/>
<a href="#" id="alert" data-role="button">Show alert</a>
</div>
<div data-role="footer"><h4>Footer</h4></div>
</div>
</body>
</html>
No comments:
Post a Comment