2012-06-02 2 views
8

내가 페이지 자체에 포스트 데이터를 제출 양식이있는 경우 :양식 제출에 jQuery로 포스트 데이터를 전송

<form method="post"> 
    <input type="text" name="name"/> 
    <input type="submit"/> 
</form> 

은 어떻게 추가 POST 데이터를 삽입하는 자바 스크립트/jQuery를 사용할 수있게됩니다. $.post(), $.get() 또는 $.ajax()과 같은 함수를 사용하여 아약스를 통해서만 양식을 제출하는 것이 더 쉬울 것입니다. 하지만 여기서하고 싶은 것은 아약스를 통해서가 아니라 양식을 제출하는 것입니다.

추가 데이터는 JavaScript로 작성되었습니다. DOM에 새로운 숨겨진 필드를 삽입하여 양식에 제출되도록 데이터를 전달할 생각이지만, 다른 방법으로 그것을 수행하고 있습니까?

더 많은 코드/설명이 필요하면 의견을 말하십시오.

+0

왜이을 downvoted했다

<?php $ime = $_POST['ime']; echo "Your name is $ime"; ?> 
**? –

답변

11

제출 버튼을 사용하는 대신 일반 버튼을 사용하고 자바 스크립트를 통해 제출을 제어하십시오. 자바 스크립트에서 폼을 serialize하고 원하는 데이터와 함께 전달해야합니다.

<script> 

    $(document).ready(function() { 

     var extra_data = "This is more stuff to send"; 

     $('#submit').click(function() { 
      $.ajax({ 
      type: "POST", 
      url: "form.php", 
      data: {'form': $("#my_form").serialize(), 'other': extra_data}, 
      success: function(msg) { 
       alert("Form Submitted: " + msg); 
      } 
      }); 

     }); 

    }); 

</script> 

<form id="my_form" method="post"> 
    <input type="text" name="name" /> 
    <input type="button" id="submit" /> 
</form> 
+0

그게 제가 질문 시체에서 말하려고하는 것입니다. 아약스를 사용하여 양식을 제출하면됩니다. –

+0

두 가지 옵션이 있습니다. 1) 양식의 숨겨진 필드. 2) AJAX. 당신이 골랐지 만 개인적으로 AJAX 방법이 더 강력하고 제출 전에 폼 유효성 검사와 같은 더 많은 기능을 사용할 수 있다고 생각합니다. –

1
<head> 
    <script src="jquery/jquery-1.11.1.min.js"></script> 
    <script> 
    $(function() { 
     $('#form_id').on('click','#submit', function(e){ 
      e.preventDefault(); 
      $.ajax({ 
       type: "POST", 
       url: "get_Ajax.php", 
       data: $('#form_id').serialize(), 
       success: function(data) { 
        alert(data); 
       } 
      }); 
      return false; 
     }); 
    }); 
    </script> 
</head> 
<form method="post" id="form_id"> 
<input type="text" name="ime"> 
<input type="button" id="submit" name="submit" value="Send"> 
</form> 

** get_ajax.php

은 는
관련 문제