JSON response opens as a file, but I can't access it with JavaScript
In the code below I make a POST
request to a servlet that replies in this way:
response.setContentType("application/json");
json = "{success:true,sessionUid:\""+sessionUid+"\"}";
response.getWriter().write(json);
So Firefox opens it like a file and I can see it's ok. Here you have the JSON:
{success:true,sessionUid:"D07WC15R7LFRFRGPF4P5"}
The problem is that I can't inspect the JSON object. It seems not to exist inside my callback function (also using Firebug). Take a look to the code and alerts.
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#loginForm").submit(function(response){
alert("response="+response); //output: "response=[object Object]"
var obj = jQuery.parseJSON(response);
alert("obj.sessionUid="+obj.sessionUid); //doesn't work, Firebug says "obj is null"
if (response.success == true){ //never true
document.location.href = 'http://localhost:8080/QuoteroClient/logged.jsp';
}else{
alert("Something went wrong in the login process.");
}
return false;
});
});
</script>
</head>
<body>
<form id="loginForm" action="http://localhost:8080/QuoteroClient/Main?servlet=Security" method="post">
<fieldset><legend>Login to Quotero:</legend>
<label>Action:</label><input type="text" name="action" value="login"/><br />
<label>Username:</label><input type="text" name="login-quotero" value="admin"/><br />
<label>Password:</label><input type="text" name="password-quotero" value="admin" /><br />
<label>Domain:</label><input type="text" name="combo-domain" value="Quotero" /><br />
</fieldset>
<input type="submit" value="Submit" />
</form>
</body>
</html>
EDIT: I also tried to do the same with an AJAX request, wothout success:
$("#ajaxSubmit").click(function () {
$.ajax({
type: "GET", //GET or POST is the same for this servlet
url: "http://localhost:8080/QuoteroClient/Main?servlet=Security&action=login&login-quotero=admin&password-quotero=admin&combo-domain=Quotero",
dataType: "json",
success: function (response) {
alert("response=" + response);
var obj = jQuery.parseJSON("" + response);
alert("obj.sessionUid=" + obj.sessionUid);
if (response.success == true) {
document.location.href = contextPath + 'http://loc开发者_开发知识库alhost:8080/QuoteroClient/logged.jsp';
} else {
alert("Something went wrong in the login process.");
}
}
});
return false;
});
This is not valid JSON:
{success:true,sessionUid:"D07WC15R7LFRFRGPF4P5"}
This is valid JSON:
{"success":true,"sessionUid":"D07WC15R7LFRFRGPF4P5"}
In JSON the keys must always be quoted. See DEMO.
I think you have mixed up ajax with submit. submit is just simply an event, when form is submitted do the following. then you can
$("#loginForm").submit(function(){
var post_data = $(this).serialize();
$.ajax({
url: '',//url of the php file that handles the forms
type: 'GET',
dataType:'json',
data:post_data,//this are the query strings, e.g. ?q=blabla&s=blabla
success:function (data){//if page was 200 or successfully loaded
alert(data.sessionUid);
// do what ever you wish with the data here
},
error: function (){
alert('Page failed to load');
}
})
return false;
});
精彩评论