0
이것이 이미 존재하는 게시물 인 경우. 나는 이것에 관해 이미 게시 된 다른 쟁점의 무리를 보았지만 어떤 것도 나의 문제와 일치하지 않는다고 느꼈다. 링크가 있으면 링크하십시오.AJAX에서 POST를 다시 읽을 때 정의되지 않음 받기
나는 AJAX를 배우려고 노력 중이며 serverName과 isLive의 두 입력을받는 양식이있다. 서버를 목록에 추가하는 단추는 물론입니다. 나는 이미 두 개의 서버가있는 json 파일을 만들었고 목록을 업데이트하기 위해 정보를 얻었을 때 서버의 serverName과 isLive를 나열합니다. POST 정보로 이동하면 목록이 업데이트 될 때 되돌아옵니다.
콘솔 로그를 사용하면 정보가 폼에서 AJAX에 의해 전송 될 객체로 전달된다는 것을 알았으며 성공 함수를 트리거 한 것처럼 보입니다. 그러나 보았을 때 Json에는 아무 것도 추가되지 않았고 필드는 정의되지 않습니다.
index.php를
<!DOCTYPE html>
<html>
<head>
<title>Ajax</title>
</head>
<body>
<h1>Server List</h1>
<ul id="servers">
</ul>
<h4>Add a Server</h4>
<p>Server Name: <input type="text" id="serverName"></p>
<p>Offline or Online: <input type="text" id="isLive"></p>
<button id="add-server">Add!</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="main.js"></script>
</body>
</html>
main.js
$(function() {
var $servers = $('#servers');
var $serverName = $('#serverName');
var $isLive = $('#isLive');
$.ajax({
type : 'GET',
url: 'servers.json',
success: function(servers) {
$.each(servers, function(i, server) {
$servers.append('<li>Server: '+ server.serverName +', Status: '+server.isLive+'<li>');
});
},
error: function() {
alert('Error loading server status!');
}
});
$('#add-server').on('click', function() {
var server = {
serverName: $serverName.val(),
isLive: $isLive.val(),
};
console.log(server);
$.ajax({
type: 'POST',
url: 'servers.json',
data: server,
success: function(newServer) {
$servers.append('<li>Server: '+ newServer.serverName +', Status: '+newServer.isLive+'<li>');
},
error: function(){
alert('error saving server');
}
});
});
});
당신은 자바 스크립트를 사용하여 서버에서 파일을 수정할 수 없습니다
[{"serverName":"vanilla","isLive":"offline"}, {"serverName":"SkyFactory","isLive":"Online"}]