javascript - 单选按钮/复选框未使用 AJAX 输入 MySQL DB

Question

我有一个应用程序，我正在尝试使用单选按钮和复选框来将信息输入数据库。目前，只有文本字段可以正确地将信息输入数据库，但复选框和单选按钮仅将第一个单选按钮的值输入数据库。因此，例如使用单选按钮时，即使选择了“否”，也会将"is"输入到数据库中。我不确定我做错了什么。

以下是相关的 HTML 函数:

function saveUserInfo(userName, userEmail, optedIn, currentUser, catDog, otherBrand)
    {
            if(optedIn === "Yes")
            {
                finalAnswers = userName + "yes" + "~" + userEmail + "~" + optedIn + "~" + currentUser + "~" + catDog + "~" + otherBrand + "~";
            }else{
              finalAnswers = userName + "no" + "~" + userEmail + "~" + optedIn + "~" + currentUser + "~" + catDog + "~" + otherBrand + "~";
              //  finalAnswers = userName + "~" + userEmail + "~0" + optedIn + "~1" + currentUser + "~2" + catDog + "~3" + otherBrand + "~4";
            }

      try
        {
          $.ajax({
            url: surveyServer + finalAnswers,
            type: 'post',
            success: function(evt){
              console.log('success saving ' + finalAnswers);
            }
          });
        }
      catch(err)
      {
        alert(err.message);

      }
    }


function saveUser()
{
  $('.wrapper').find("#userEmail").blur();
        if (($('#userName').val().length > 0) && ($('#userEmail').val().length > 0))
        {
            var testEmail = /^[A-Z0-9._%+-]+@([A-Z0-9-]+\.)+[A-Z]{2,4}$/i
            var valueToTest = $('#userEmail').val();
            if (testEmail.test(valueToTest))
            {
                //pass
                saveUserInfo($('#userName').val(), $('#userEmail').val(), $('#optedIn').val(), $('#currentUser').val(), $('#catDog').val(), $('#otherBrand').val());
                $('.wrapper').slick('slickNext');
            } else {
                // Do whatever if it fails.
      alert("Please enter a valid email address.");
                $('.wrapper').find("#userEmail").focus();
            }

        }else{
            alert("Please enter your name and email address then click Submit.");
            $('.wrapper').find("#userName").focus();
        }
    }

这是 SurveySurver 代码:

if (isset($_GET['user']))
    {
            try
            {
                $dbh = new PDO('mysql:host=localhost; dbname=bp1234', 'bp1234','bp1234');


                $userAnswerArray = explode("~", $_GET['user']);

                $stmt = $dbh->prepare("INSERT INTO bpQuiz (userName, userEmail, optedIn, currentUser, catDog, otherBrand) VALUES (:userName, :userEmail, :optedIn, :currentUser, :catDog, :otherBrand)");

                $stmt->bindParam(':userName', $userName);
                $stmt->bindParam(':userEmail', $userEmail);
                $stmt->bindParam(':optedIn', $userOption);
                $stmt->bindParam(':currentUser', $currentUser);
                $stmt->bindParam(':catDog', $catDog);
                $stmt->bindParam(':otherBrand', $otherBrand);

                // insert value
                $userName = $userAnswerArray[0];
                $userEmail = $userAnswerArray[1];
                $userOption = $userAnswerArray[2];
                $currentUser = $userAnswerArray[3];
                $catDog = $userAnswerArray[4];
                $otherBrand = $userAnswerArray[5];
                $stmt->execute();

            }

            catch (PDOException $e)
            {
                    echo 'ERROR: ' . $e->getMessage();
            }

    }
    else
    {
        echo "no querystring...";
    }

为了更好地衡量，这里是表单字段:

      <input type="text" class="contactFormInputBox" name="userName" id="userName"/>
      <input type="text" class="contactFormInputBox" name="userEmail" id="userEmail"/>
      <input type="checkbox" name="optedIn" id="optedIn" value="Yes">
        <input type="radio" name="currentUser" value="1" id="currentUser">Yes
        <input type="radio" name="currentUser" value="0" id="currentUser">No
        <input type="radio" name="catDog" value="cat" id="catDog">Cat
        <input type="radio" name="catDog" value="dog" id="catDog">Dog
        <input type="radio" name="catDog" value="both" id="catDog">Both
      </div>
      <div class="surveyOptions" id="Q2-b">
        <input type="text" class="contactFormInputBox" name="otherBrand" id="otherBrand"/>

Answer 1

我按照 Freedomn-m 的建议删除了“ID=”，并且还必须更改以下代码，该代码从选中的单选按钮/复选框中提取值(即: $(“input[type=checkbox][ name=optedIn]:checked").val()) :

function saveUser()
    {
      $('.wrapper').find("#userEmail").blur();
            if (($('#userName').val().length > 0) && ($('#userEmail').val().length > 0))
            {
                var testEmail = /^[A-Z0-9._%+-]+@([A-Z0-9-]+\.)+[A-Z]{2,4}$/i
                var valueToTest = $('#userEmail').val();
                if (testEmail.test(valueToTest))
                {
                    //pass
                    saveUserInfo($('#userName').val(), $('#userEmail').val(), $( "input[type=checkbox][name=optedIn]:checked" ).val(), $( "input[type=radio][name=currentUser]:checked" ).val(), $( "input[type=radio][name=catDog]:checked" ).val(), $('#otherBrand').val());
                    $('.wrapper').slick('slickNext');
                } else {
                    // Do whatever if it fails.
          alert("Please enter a valid email address.");
                    $('.wrapper').find("#userEmail").focus();
                }

            }else{
                alert("Please enter your name and email address then click Submit.");
                $('.wrapper').find("#userName").focus();
            }
        }