양식을 제출하고 같은 페이지에 머 무르시겠습니까?

양식을 제출하고 같은 페이지에 머 무르시겠습니까?

---

다음과 같은 양식이 있습니다.

<form action="receiver.pl" method="post">
  <input name="signed" type="checkbox">
  <input value="Save" type="submit">
</form>

제출을 클릭 할 때 동일한 페이지에 머물고 싶지만 여전히 receiver.pl실행되었습니다.

어떻게해야합니까?

---

가장 쉬운 대답은 jQuery입니다. 다음과 같이하십시오.

$(document).ready(function(){
   var $form = $('form');
   $form.submit(function(){
      $.post($(this).attr('action'), $(this).serialize(), function(response){
            // do something here on success
      },'json');
      return false;
   });
});

콘텐츠를 동적으로 추가하고 여전히 작동하는 데 필요한 경우 및 둘 이상의 양식에서 다음을 수행 할 수 있습니다.

   $('form').live('submit', function(){
      $.post($(this).attr('action'), $(this).serialize(), function(response){
            // do something here on success
      },'json');
      return false;
   });

---

99 %의 시간 동안 XMLHttpRequest를 사용 하거나 이와 같은 것을 가져옵니다 . 그러나 자바 스크립트가 필요없는 대체 솔루션이 있습니다.

페이지에 숨겨진 iframe을 포함하고 해당 iframe을 가리 키도록 양식의 대상 속성을 설정할 수 있습니다.

<style>
  .hide { position:absolute; top:-1px; left:-1px; width:1px; height:1px; }
</style>

<iframe name="hiddenFrame" class="hide"></iframe>

<form action="receiver.pl" method="post" target="hiddenFrame">
  <input name="signed" type="checkbox">
  <input value="Save" type="submit">
</form>

이 경로를 선택할 시나리오는 거의 없습니다. 일반적으로 자바 스크립트로 처리하는 것이 더 낫습니다.

• 오류 처리 (예 : 재시도)
• UI 표시기 제공 (예 : 로딩, 처리, 성공, 실패)
• 요청이 전송되기 전에 로직을 실행하거나 응답을 수신 한 후 로직을 실행하십시오.

---

이를 수행하는 HTTP / CGI 방법은 프로그램이 HTTP 상태 코드 204 (컨텐츠 없음)를 리턴하는 것입니다.

---

제출 버튼을 누르면 페이지가 서버로 전송됩니다. 비동기로 보내고 싶다면 ajax로 할 수 있습니다.

---

XMLHttpRequest 사용

var xhr = new XMLHttpRequest();
xhr.open("POST", '/server', true);

//Send the proper header information along with the request
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

xhr.onreadystatechange = function() { // Call a function when the state changes.
    if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {
        // Request finished. Do processing here.
    }
}
xhr.send("foo=bar&lorem=ipsum");
// xhr.send(new Int8Array()); 
// xhr.send(document);

---

다음을 사용하십시오 action="".. 자바 스크립트와 같은 것은 필요하지 않습니다.

참조 URL : https://stackoverflow.com/questions/5733808/submit-form-and-stay-on-same-page