AJAX를 사용하여 데이터베이스에 데이터를 삽입하려고합니다. ajax호출은 데이터베이스에 데이터를 삽입하기위한 것입니다 서블릿,로 이동합니다. 하지만 ajax객체 초기화에서 어딘가에서 실수를 한 것 같습니다. 제출 버튼을 클릭하면 데이터가 데이터베이스에 제출되지 않습니다.
HTML :
<form class='form-inline'>
<div class='form-group'>
<label for='nameField'>Name</label>
<input type='text' class='form-control' id='nameField'name='nameField' placeholder='David'>
</div>
<div class='form-group'>
<label for='goalField'>Goals Scored</label>
<input type='text' class='form-control' id='goalField' name="goalField" placeholder='0'>
</div>
<div class='form-group'>
<label for='passField'>Passes Made</label>
<input type='text' class='form-control' id='passField' name="passField" placeholder='0'>
</div>
<button type='submit' class='btn btn-primary' id='submitdata'>Submit to database</button>
</form>
JQuery :
<script>
$(document).ready(function() {
$('#submitdata').click(function(event) {
event.preventDefault();
alert('clicked');
if(window.XMLHttpRequest) {
$xhr = new XMLHttpRequest();
$xhr.onreadystatechange = function() {
if($xhr.readyState === 4 && $xhr.status === 200) {
$xhr.open("GET","insert","true");
$xhr.send();
}
}
} else {alert('else statement');}
});
});
</script>
내가 어디에서 실수를 했습니까?
콜백 내에서가 아닌 준비 상태 변경 리스너 외부에서 open () 및 send ()를 호출해야합니다. :)
$('#submitdata').click(function(event) {
event.preventDefault();
alert('clicked'); // DOESN'T GO BEYOND THIS
if(window.XMLHttpRequest) {
$xhr = new XMLHttpRequest();
// bind the readystage change listener first
$xhr.onreadystatechange = function() {
if($xhr.readyState === 4 && $xhr.status === 200) {
alert('response received');
}
}
// call open passing request type, url, async
$xhr.open("GET","/context-root/insert.do",true);
$xhr.send();
} else {
alert('else statement');
} // DOESN'T EVEN REACH HERE
});
또한 load이벤트를 사용 하여 응답을 처리 할 수 있습니다.
jQuery를 사용하면 다음과 같이 할 수 있습니다.
$('#submitdata').click(function(event) {
event.preventDefault();
$.ajax({
'url' : '/ctxRoot/insert',
'type': 'GET' // default is GET
})
.done(function(data){
console.log('Ajax response - '+data);
});
});
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다