Передача данных формы в MySQL через AJAX

Question

Я использую JavaScript и AJAX для отправки данных формы в файл обработки php, чтобы затем заполнить базу данных SQL без обновления начальной страницы формы.

Соединение php / SQL работает, но данные формы отправляются неправильно.

Есть два поля: радиогруппа с именем «выбор» и текстовое поле с именем «комментарии». Когда БД заполнена, поле выбора всегда «да» (первая из трех переключателей), а поле комментариев всегда пусто. Я думаю, что проблема должна заключаться в том, как создается строка данных, но многочасовые попытки не принесли успеха.

Вот HTML-форма

<form id="paPoll">
  <label><input type="radio" name="RadioGroup1" value="yes" id="choice1">Yes</label>
  <label><input type="radio" name="RadioGroup1" value="no" id="choice2">No</label>
  <label><input type="radio" name="RadioGroup1" value="dont_know" id="choice3">I Don't Know</label>
  <label for="comments">Comments?</label><input name="comments" type="text" id="comments" size="25" maxlength="60">   
  <input type="button" name="form_process" id="form_process" value="submit" onClick="$.fn.removeMbMenu($.mbMenu.options.actualOpenedMenu,true);" />
</form>

вот функция Javascript / AJAX

<script type="text/javascript">
    $(function() {
      $("#form_process").click(function() {
        var choice = $("#choice").val();
        var comments = $("#comments").val();
        var dataString = 'choice='+ choice + '&comments=' + comments;

        $.ajax({
          type: "POST",
          url: "**ABSOLUTE URL TO PROCESSOR**",
          data: dataString
        });
      });
    });
</script>

вот процессор php

<?php
$choice = $_POST ['choice'];
$comments = $_POST ['comments'];
//perform insert
    $query = mysql_query("INSERT INTO paPoll 
    (choice, comments)      
    VALUES  
    ('$choice', '$comments')");         
        if (!query) {
           die("Database query failed: " . mysql_error());
        }
?>

Мысли или предложения?

Я нашел очень похожий вопрос здесь, но теме уже 3 года. Пользователь предложил это

//Instead of using
data: dataString
//use
data : {param: value, param2: value2}

но я не уверен, как или в каком формате он хочет получить значения параметров.

Спасибо.
-syllable

Answer 1

Если бы это был я, я бы упростил это с помощью плагина Form . У него уже есть ajaxSubmit набор функций, позволяющих легко изменить форму. У IT также есть удобная функция formSerialize, которая будет сериализовать форму для отправки ajax или для добавления к строке запроса для ссылки. : -)

Сказал, что проще без плагинов и использования существующего кода:

$("#form_process").click(function() {

  $.ajax({
    type: "POST",
    url: "**ABSOLUTE URL TO PROCESSOR**",
    data: {
      'choice': $("input[@name=RadioGroup1]:checked").val(), 
      'comments':  $("#comments").val()
    }
  });

});

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

Answer 2

несколько недель назад у меня возникла та же проблема, и я просто пытаюсь использовать старый способ, подобный этому

<script type="text/javascript">
    $(function() {
      $("#form_process").click(function() {
        //$("#choice").val(); //you cannot use the same id for more than 1 tag
        var choice = 0; 
             if(document.getElementById("choice1").checked) choice='Yes';
        else if(document.getElementById("choice2").checked) choice='No';
        else if(document.getElementById("choice3").checked) choice='Dont Know';

        var comments = document.getElementById('comments').value; //$("#comments").val();
        var dataString = 'choice='+ choice + '&comments=' + comments;

        $.ajax({
          type: "POST",
          url: "**ABSOLUTE URL TO PROCESSOR**",
          data: dataString
        });
     });
   });
</script>

на самом деле я не знаю, я думаю, что это не лучший способ, но эта работа для меня:)