私はAJAX チュートリアルに従っていますが、彼と同じことをしましたが、なぜそれがうまくいかないのかわかりません。これが私がやったことです。
index.jsp
ヘッダーにソーススクリプトを配置しました
<script src="../javascript/jquery-1.10.2.js"></script>
<script src="../javascript/basic.js"></script>
<link rel="stylesheet" href="css/basic.css" type="text/css" media="screen">
本文では、単純なスニップネットが作成されます
<p class="large">Test AJAX</p>
<form id="updateUsername">
<label for="username">What is your name?</label>
<input type="text" name="username" id="username" />
<input type="submit" />
</form>
<p id="displayName" />
ajax のbasic.js
コード
$(document).ready(function(){
$('#updateUsername').submit(function(){
$.ajax({
url: 'update',
type: 'post',
dataType: 'jason',
data: $('#updateUsername'),
success: function(data){
if(data.isValid){
$('#displayName').html('Your name is: ' + data.username);
$('#displayName').slideDown(500);
}
else {
alert('Please enter a valid username !!');
}
}
});
return false;
});
});
UpdateUsername.java
サーブレット
Map<String, Object> map = new HashMap<String, Object>();
boolean isValid = false;
String username = request.getParameter( "username" );
if( username != null && username.trim().length() != 0 )
{
isValid = true;
map.put( "username", username );
}
map.put( "isValid", isValid );
write( response, map ); // WRITE METHOD
最後に、サーブレットからの書き込みメソッド
response.setContentType( "application/json" );
response.setCharacterEncoding( "UTF-8" );
response.getWriter().write( new Gson().toJson( map ) );
動作する前にセットアップが必要ですか? 私がそれをテストすると、URLはこのhttp://localhost:8080/TestProject/?username=test
ようになり、POST
動作しないようです。私は何か見落としてますか?
更新
私はからに変更し$('#displayName'),slideDown(500);
ました$('#displayName').slideDown(500);
ところで、charset
とその他を に変更しましたUTF-8
。一番上には、index.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
そして頭に<meta charset="utf-8">
web.xml
<servlet>
<servlet-name>UpdateUsername</servlet-name>
<servlet-class>com.ajax.servlets.UpdateUsername</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>UpdateUsername</servlet-name>
<url-pattern>/update</url-pattern>
</servlet-mapping>
結果イメージ