Вопрос по php, javascript, jquery – отправка данных с помощью jquery при отправке формы

8

Если у меня есть эта форма, которая отправляет данные поста на саму страницу:

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

Как я смогу использовать JavaScript / jQuery для добавления дополнительных данных POST. Это было бы проще, если бы я отправлял форму только через ajax, используя любую из функций, таких как$.post(), $.get(), или же$.ajax(), Но то, что я хочу сделать здесь, это отправить форму не через ajax.

Дополнительные данные в JavaScript. Я думаю о том, чтобы просто вставить новое скрытое поле в DOM, в которое я передам данные, чтобы они передавались вместе с формой, но есть ли другой способ сделать это?

Пожалуйста, прокомментируйте, если вам нужно больше кода / объяснения.

почему это было отвергнуто? Wern Ancheta

Ваш Ответ

2   ответа
11

Вместо того, чтобы использовать кнопку отправки, используйте обычную кнопку и управляйте отправкой через Javascript. В вашем javascript вам нужно сериализовать форму и передать ее как данные вместе со всем, что вы хотите.

<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>
Error: User Rate Limit Exceeded Wern Ancheta
Error: User Rate Limit Exceeded
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";
?>

Похожие вопросы