2012-06-02 26 views
8

Ben sayfanın kendisine yazılan veri gönderen bu formu varsa:Form gönderilmesini jquery ile yazılan veri göndermeyi

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

nasıl ek bir POST verilerini enjekte JavaScript/jQuery kullanmak mümkün olacak. Bu formu yalnızca $.post(), $.get() veya $.ajax() gibi işlevlerden birini kullanarak ajax yoluyla gönderirsem daha kolay olurdu. Ama burada yapmak istediğim, formu ajax ile göndermemektir.

Ek veriler JavaScript'dir. Veriye gireceğimiz DOM'a yeni bir gizli alan enjekte etmeyi düşünüyorum, böylece formla birlikte gönderilecek, ancak başka bir yolu var mı?

Daha fazla kod/açıklama gerekiyorsa lütfen yorum yapın.

+0

neden bu downvoted edildi

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

cevap

11

Bir gönderme düğmesi kullanmak yerine, normal bir düğme kullanın ve Javascript aracılığıyla gönderimi denetleyin. Javascript'inizde, formu serileştirmeniz ve istediğiniz gibi başka bir şeyle birlikte veri olarak aktarmanız gerekir.

<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

Soru gövdesinde söylemeye çalıştığım şey bu. Sanırım formu göndermek için ajax kullanmalıyım. –

+0

İki seçeneğiniz vardır: 1) Formunuzdaki gizli alanlar. 2) AJAX. Siz seçersiniz, fakat kişisel olarak AJAX yönteminin daha sağlam olduğunu ve gönderilmeden önce form doğrulaması gibi daha fazla işlevsellik sağladığını düşünüyorum. –

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

İlgili konular