Ajax가 비동기 적으로로드되고 있습니다. 양식 제출시 페이지 새로 고침

아약스를 배우려고했지만 코드가 정확하다는 것을 알 수 있었지만 반환 된 json 문자열을 반향시킬 때 항상 페이지를 새로 고칩니다. 어떤 도움이라도 대단히 감사하겠습니다!Ajax가 비동기 적으로로드되고 있습니다. 양식 제출시 페이지 새로 고침

<script>  
    // Get XML HTTP Type 
    function get_XmlHttp() { 
     var xmlHttp = null; 
      if(window.XMLHttpRequest) { 
       xmlHttp = new XMLHttpRequest(); 
      }else if(window.ActiveXObject) { 
       xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
      } 
     return xmlHttp; 
    } 

    function ajaxSuccess() { 
     alert(this.responseText); 
    } 

    function ajaxrequest(oFormElement) { 
     //Get The Correct XMLHTTP Object 
     var request = new XMLHttpRequest();    

     request.open(oFormElement.method, oFormElement.action, true); 
     request.setRequestHeader("Content-type","application/x-www-form-urlencoded"); 
     request.send(new FormData(oFormElement)); 
     return false; 
     request.onreadystatechange = function() { 
      if (request.readyState == 4 && request.status == 200) { 
       alert("done"); 
       document.getElementById('comment_form').innerHTML = request.responseText; 
      } 
     }  
    } 
    </script> 


<form action="<?php echo $add_comment; ?>" method="post" enctype="multipart/form-data" id="comment_form" onsubmit="ajaxrequest(this);"> 
    <input name="user_id" type="hidden" value="<?php echo $user_id; ?>"> 
    <input name="user_message_id" type="hidden" value="<?php echo $user_message_id; ?>"> 
    <textarea id="new_comment" name="new_comment" cols="100" rows="5"></textarea> 
    <input type="submit" value="post request"/> 
</form>

출처

2013-12-19 user2300933

나는 장님이 될 수 있지만,'submitForm()'함수는 어디에 있는가? – adeneo

제출 단추가있는 예제와 "" – user2300933

예제에서와 같이 실제로 두 가지 방법으로 시도했습니다. 함수는 폼 전송 단추의 기본 동작을 막지 못합니다. – Pointy

이벤트가 발생하지 않도록해야합니다. 이 자바 스크립트의 일반적인 사용 기능이있다 :

e.preventDefault; // e is the event that you need to pass to your function.

또는 변경은
<input type="submit" value="post request"/>

<input type="button" onclick="ajaxrequest(this);" value="post request"/>

에 어떤 양식은 자바 스크립트 페이지 의지 MOT에 의해 처리 될 것입니다 무슨 일이 일어날 양식 제출로 인해 다시로드하십시오.
이 방법을 직접 수정하면 문제가 해결됩니다.

출처

2013-12-19 19:02:48 Justin

저스틴, 당신은 그게 정확히 문제입니다. 그러나 결과가 나타나기를 원하는 곳에 오류가 나타납니다. 지금 양식 제출 작업 중 "정의되지 않은 지원되지 않음."오류가 발생합니다. 그것은 여전히 내 양식 값을 당기는 것입니까? – user2300933

나는 그것을 매우 간단하게 이해했다. 내 원래 코드가 "return false;가 누락되었습니다." 폼의 onsubmit 속성 여러분 모두를 도와 주셔서 감사합니다! – user2300933

알아두면 좋을 것. 내가 고칠 수있어서 기쁘다. – Justin

Jquery 라이브러리 http://api.jquery.com/jQuery.ajax/을 사용합니다.하지만 자신 만의 스크립트를 만들고 싶다면. W3C 문서를 참조 http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp

출처

2013-12-19 18:30:47

내가 무엇을 그들이 W3schools.com에서 제안의 변형입니다. 내가 가지고있는 문제는 내 것이 페이지를 새로 고치는 양식이기 때문입니다. 나는 그것을 지키지 않는 것이 확실합니다. – user2300933

http://www.w3fools.com/ –

뾰족한가 지적한 것처럼, 당신은

submitForm(event) { 
    event.preventDefault(); 
}

~~http://api.jquery.com/event.preventDefault/~~ < 발사에서 제출 버튼의 기본 클릭 이벤트를 방지 할 수 있습니다 - 내 나쁜 ...

을 그냥 명확히하기 위해 완전한 코드입니까?

출처

2013-12-19 18:38:55 inohika

opencart 내부에서 사용중인 TPL 파일의 일부인 것으로 나타났습니다. – user2300933

OP는 jQuery를 사용하지 않습니다 ... –

Ajax가 비동기 적으로로드되고 있습니다. 양식 제출시 페이지 새로 고침

답변

관련 문제