以下のコードがあります。これで、フォーム全体を JSON に変換し、jquery AJAX を使用して投稿したいと考えています。私の問題は、サーブレットに入り、request.getParameterで値を取得できることですが、それでもajaxが失敗します。応答を取得したら、返された応答を表示し、同じページに表示したいと思います。何が間違っているかを見つけるのを手伝ってください。私はたくさん検索しましたが、正しい答えにリンクできませんでした。よろしくお願いします！
ここに私のコード。ShowHideDiv_ajax.html
<script>
$(document).ready(function() {
$('#form_submit').click(function (event) {
event.preventDefault();
var form = $("#myform");
var json = ConvertFormToJSON(form);
$("#results").text(JSON.stringify(json) );
$.ajax({
url: 'AjaxServlet',
type: 'POST',
dataType: 'json',
cache: false,
//contentType: 'application/json; charset=utf-8',
data: json,
success: function( response ) {
//I want to use this response to be displayed on the same page.
alert('success');
},
error: function() { // if error occured
alert('fail:');
}
});
return false;
});
function ConvertFormToJSON(form){
var array = form.serializeArray();
var json = {};
$.each(array, function() {
//alert('this.name='+this.name+'this.value='+this.value);
if (json[this.name] !== undefined) {
if (!json[this.name].push) {
json[this.name] = [json[this.name]];
}
jsono[this.name].push(this.value || '');
} else {
json[this.name] = this.value || '';
}
});
return json;
}
});
</script>
<style>
</style>
</head>
<body>
<form class="ajax_form" id="myform" name="myform" method="post" action="AjaxServlet" >
<table>
<tr>
<td colspan="2"><div id="error" class="error"></div></td>
</tr>
<tr>
<td>Enter your name : </td>
<td> <input type="text" id="name" name="firstname"><br/></td>
</tr>
<tr>
<td>Education : </td>
<td> <input type="text" id="education" name="edu"><br/></td>
</tr>
<tr>
<td colspan="2"><div id="info" class="success"></div></td>
</tr>
</table>
</form>
<p><tt id="results"></tt></p>
<p><tt id="results1"></tt></p>
<input class="ajax_button" type="submit" value="Submit" id="form_submit" name="form_submit">
</body>
そして、サーベルト AjaxServlet.java:
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
{
// TODO Auto-generated method stub
System.out.println("in post ajaxservlet");
try {
String fn, ed=null;
fn = request.getParameter("firstname");
ed = request.getParameter("edu");
System.out.println("receieved data:"+fn+ed);
if(request.getParameter("firstname").toString()!=null){
fn="Hello User";
}
PrintWriter out = response.getWriter();
response.setContentType("text/json");
response.setCharacterEncoding("UTF-8");
out.write(fn);
out.close();
System.out.println("data posted");
} catch (Exception e) {
// TODO: handle exception
e.printStackTrace();
}
}