Javascript 通过Ajax向PHP后端提交表单时返回错误

我正在构建一个表单，要求用户输入姓名、地址、数量1、数量2和注释

对于数量1和数量2，收音机的值不同

当我提交表格时，我的可变$rate_错误返回值必须输入评级注释；即使它不是空白的

我的收音机输入有问题吗

我是否将amount1变量赋值错误

当用户选择不同的金额时，我需要更改变量的值

HTML 使现代化 对我的javascript进行了一些更改，但现在收到500个内部错误

    $("#main-rate").submit(function()
        {
             var address = $('#geocomplete').val();
             var name = $("input[name='landlord_name']").val();
             var amount1 = $("input[name='amount1']").val();
             var amount2 = $("input[name='amount2']").val();         
             var amount3 = $("input[name='amount3']").val();         
             var amount4 = $("input[name='amount4']").val();
             var amount5 = $("input[name='amount5']").val();
             var amount6 = $("input[name='amount6']").val();
             var amount7 = $("input[name='amount7']").val();
             var comment = $('#comment').val();                                

             var dataString = {
             name: name,
             address: address,
             amount1: amount1,
             amount2: amount2,
             amount3: amount3,
             amount4: amount4,
             amount5: amount5,
             amount6: amount6,
             amount7: amount7,
             comment: comment

            }


            if (dataString.name == '' || dataString.address == '' || dataString.amount1 == '' || dataString.amount2 == '' || dataString.amount3 == '' || dataString.amount4 == '' || dataString.amount5 == '' || dataString.amount6 == '' || dataString.amount7 == '' || dataString.comment == '')
            {
                console.log("Please Fill All Fields");
            }  else
        {
            // AJAX Code To Submit Form.
            $.ajax({
                type: "POST",
                url: "path/to/url",
                data: dataString,
                cache: false,
                success: function(result)
                {
                   console.log(result);

                    $('rate-section').html(
                        '<div><h1>THANKS FOR RATING!</h1></div>'
                     );


                    return false;


                }
            });
        }
        return false;
    });
});

---

正如@ShaunakD指出的，您没有正确地将数据发送到服务器。如果您的所有输入都用字母“a”填写，它仍然会提交，但PHP收到的是“aaaaa”，从技术上讲不是这样的，因为下面的收音机和数量1&2分配问题没有说明传递了什么变量

我建议他的第一种方法将您的dataString分配行更改为：

 var dataString = {
   name: name,
   address: address,
   amount1: amount1,
   amount2: amount2,
   comment: comment
 };

您当前的实现在检索amount1和amount2的值时会遇到问题。您正在submit函数中为onchange分配事件。您应首先删除每个无线电输入的id属性，并将其赋值替换为：

 var amount1 = $("input[name='amount1']").val();
 var amount2 = $("input[name='amount2']").val();

编辑：为下面我的第一条评论提供更多上下文：

 $("#main-rate").submit(function()
 {


    var address = $('#geocomplete').val();
    var name = $("#name").val();
    var comment = $('#comment').val();  
    var amount1 = $('input[name="amount1"]').val();
    var amount2 = $('input[name="amount2"]').val();

   //Remove this entirely
   /*
   var amount1 = document.getElementsByName('amount1');
   for (var i = amount1.length; i--;) {
       amount1[i].onchange = function() {

             amount1 = this.value;
             console.log(amount1);
         }
     }
   var amount2 = document.getElementsByName('amount2');
   for (var i = amount2.length; i--;) {
       amount2[i].onchange = function() {

             amount1 = this.value;
             console.log(amount2);
         }
   }
   */

---

祝你好运

通过ajax传递的数据应该是{name:'value'}或name=value&name2=value2格式如果在某些浏览器中按f12打开开发人员工具并转到网络选项卡，则可以看到表单传递的所有内容。调试您为什么没有选择某些可以使用的值是很有帮助的。序列化以获得正确格式的数据。嘿，Steve，那么我应该将.onchage函数与新变量表达式var amount1=$input[name='amount1'].val；一起移到提交事件之外吗？我看不出onchange事件处理的循环有什么用途。要做到用一行、sans循环和onchange事件处理就可以做到的事情，还有很长的路要走。简单地说，删除并替换VarAmount1和2分配，并使用我的建议循环onchange，如果您仍然有问题，请告诉我。干杯这样做更有意义。它现在正在提交，但我从服务器收到状态为500的内部错误。您在哪里看到500错误？在开发工具控制台中？“path/to/url”是否正常工作？您的PHP代码似乎也没有向响应返回/打印任何内容，只是设置了似乎在任何地方都无法使用的变量。是的，它表示加载资源失败：服务器响应的状态为500 Internal server Error（内部服务器错误）

 var dataString = {
   name: name,
   address: address,
   amount1: amount1,
   amount2: amount2,
   comment: comment
 };

 var amount1 = $("input[name='amount1']").val();
 var amount2 = $("input[name='amount2']").val();

 $("#main-rate").submit(function()
 {


    var address = $('#geocomplete').val();
    var name = $("#name").val();
    var comment = $('#comment').val();  
    var amount1 = $('input[name="amount1"]').val();
    var amount2 = $('input[name="amount2"]').val();

   //Remove this entirely
   /*
   var amount1 = document.getElementsByName('amount1');
   for (var i = amount1.length; i--;) {
       amount1[i].onchange = function() {

             amount1 = this.value;
             console.log(amount1);
         }
     }
   var amount2 = document.getElementsByName('amount2');
   for (var i = amount2.length; i--;) {
       amount2[i].onchange = function() {

             amount1 = this.value;
             console.log(amount2);
         }
   }
   */