2016-07-01 4 views
0

나는 몇 일 동안이 문제에 대한 답변을 찾고 있었지만 다른 게시물의 답변을 놓친 경우 알려 주시기 바랍니다.

나는 아약스에 얻으려고, 그래서 별도의 PHP와 자바 스크립트 파일 내 index.php를 매우 간단한 양식을 가지고

index.php를

<div id="ajax-test"> 
    <form action="ajax/ajax.php" method="POST"> 
     <textarea name="someText" id="some-text" placeholder="Type something here"></textarea> 
      <button type="button" onclick="loadDoc()">Submit</button> 
    </form> 
    <div id="ajax-text"></div> 
</div> 

main.js :

function getXMLHttpRequestObject() { 
    var temp = null; 

    if(window.XMLHttpRequest) 
     temp = new XMLHttpRequest(); 
    else if(window.ActiveXObject) // used for older versions of IE 
     temp = new ActiveXObject('MSXML2.XMLHTTP.3.0'); 

    return temp; 
}// end getXMLHttpRequestObject() 


function loadDoc() { 
    var ajax = getXMLHttpRequestObject(); 

    ajax.onreadystatechange = function() { 
     if(ajax.readyState == 4 && ajax.status == 200) { 
      document.getElementById('ajax-text').innerHTML = ajax.responseText; 
      console.log(ajax.responseText); 
     } 
    }; 

    ajax.open("POST", "ajax/ajax.php", true); 
    ajax.send(); 
} 

ajax.php :

<?php 

print_r('\'' . $_POST['someText'] . '\' is what you wrote'); 

?> 

인쇄하려고 할 때마다 다음과 같이 인쇄됩니다. " ''당신이 쓴 것입니다."- 무엇이 누락 되었습니까? /하지 않고/잘못 처리하여 someText의 내용에 액세스하지 못하게합니까? 내 이름 지정 규칙을 변경했습니다. 작은 따옴표를 큰 따옴표로 바꾸고 POST 대신 GET을 시도했지만 아무 것도 작동하지 않았습니다.

+2

파일 파일 ] (https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/send)? – FirstOne

+0

브라우저의 개발자 도구에서 AJAX 요청/응답을 보았습니까? 보고 된 오류가 있습니까? 이걸 웹 서버에서 실행하고 있습니까? –

+0

@FirstOne은'loadDoc()'를 호출 할 때 보낼 데이터를 캡처해야한다고 말했고 –

답변

0

등 여기에 예를 들어 당신은 내가 지금 밖으로 나열 할 시간이 없어 코드에 문제가 몇 가지 있었다. 이 잘 작동합니다, 플러스 나는 제출 단추를 클릭하지 않고도 라이브 텍스트를 표시하려면 onkeyup() 함수를 사용합니다.

인덱스 파일

<div id="ajax-test"> 
<form method="POST" onsubmit="return false;"> 
    <textarea onkeyup="loadDoc()" name="someText" id="someText" placeholder="Type something here"></textarea> 
     <button type="button" onclick="loadDoc()">Submit</button> 
</form> 
<div id="ajax-text"></div> 
</div> 
<script type="text/javascript" src="main.js"></script> 

메인 자바 스크립트) (

function _(x) { 
    return document.getElementById(x); 
} 
function ajaxObj (meth, url) { 
    var x = new XMLHttpRequest(); 
    x.open(meth, url, true); 
    x.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    return x; 
} 
function ajaxReturn(x){ 
    if(x.readyState == 4 && x.status == 200) { 
     return true; 
    } 
} 
function loadDoc() { 
    var someText = _("someText").value; 
    var ajax = ajaxObj("POST", "ajax/ajax.php"); 

    ajax.onreadystatechange = function() { 
     if(ajaxReturn(ajax) == true) { 
      _('ajax-text').innerHTML = ajax.responseText; 
      console.log(ajax.responseText); 
     } 
    } 
    ajax.send("someText="+someText); 
} 

PHP의 AJAX 보내 [호출 할 때 데이터를 설정할 필요가 없습니다

if(isset($_POST['someText'])){ 
    $someText = $_POST['someText']; 
    echo "\"$someText\"" . ' is what you wrote'; 
    exit(); 
} else { 
    echo "An error occured"; 
    exit(); 
} 
+0

@DrewAdams Main.js 파일이 적절한 요청을 보내지 않고 Main.js 코드가 약간 엉망이었습니다. 또한 index.php 파일에서 textarea의 ID를 'some-text'로 설정하는 동안 당신은 ajax.php에서 'someText'를 찾고있었습니다. – DanielTheGeek

1

헤더 요청을 설정하고 데이터를 보내기 안에 넣을 수도 있습니다. 이 오류

Undefined index: someText in C:\xampp\htdocs\ssms\sandbox\ajax\ajax.php on line 3 

의 beacuse 아마 시스 -

ajax.open("POST", "ajax/ajax.php", true); 
ajax.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
ajax.send("someText="+document.getElementById('some-text').value); 
+0

이것은 효과가 있습니다! "someText"로 내 ajax-text div 아래에 ap 태그가 생성되었습니다. 왜 그런지 이해할 수 있습니까? 생성 되나요? –

관련 문제