2012-06-02 20 views
8

Jeśli mam to postać, która podnosi danych post na samej stronie:wysyłania danych post z jQuery na przesyłanie formularza

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

Jak będę mógł używać JavaScript/jQuery wstrzyknąć dodatkowe dane POST. Byłoby to łatwiejsze, gdybym tylko przesłał formularz przez ajax, używając dowolnej z funkcji, takich jak $.post(), $.get() lub $.ajax(). Ale to, co chcę tutaj zrobić, to złożyć formularz nie za pośrednictwem ajax.

Dodatkowe dane są w języku JavaScript. Zastanawiam się nad po prostu wstawieniem nowego ukrytego pola do DOM, w którym będę przekazywał dane, aby zostały przesłane w formularzu, ale czy jest inny sposób na zrobienie tego?

Prosimy o komentarz, jeśli potrzebujesz więcej kodu/wyjaśnienia.

+0

dlaczego ten downvoted? –

Odpowiedz

11

Zamiast używać przycisku przesyłania, użyj zwykłego przycisku i steruj przesyłaniem za pomocą Javascript. W twoim javascript musisz serializować formularz i przekazywać go jako dane wraz ze wszystkim, co chcesz.

<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

To właśnie próbuję powiedzieć w treści pytania. Sądzę, że po prostu będę musiał użyć ajaxa, aby przesłać formularz. –

+0

Masz dwie opcje: 1) Ukryte pola w formularzu. 2) AJAX. Wybieracie, ale osobiście uważam, że metoda AJAX jest bardziej niezawodna i pozwala na większą funkcjonalność, taką jak sprawdzanie formularza przed przesłaniem. –

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 **

<?php 
$ime = $_POST['ime']; 

echo "Your name is $ime"; 
?> 
Powiązane problemy