AJAX将Jquery发布到PHP

时间:2017-12-20 09:58:53

标签: javascript php jquery html ajax

您好我试图用jquery发布一些值来在PHP中使用它们,问题是我无法让它工作。

这是我的代码:

 <script type="text/javascript">
        $(document).ready(function() {
            var max_fields      = 100; //maximum input boxes allowed
            var wrapper         = $(".input_fields_wrap"); //Fields wrapper
            var add_button      = $(".add_field_button"); //Add button ID
            var buttonpressed = $(".Totalform"); //Add button ID

            var x = 1; //initlal text box count

            //first one needs the code to so here.
            var arrayFromPHP = <?php echo json_encode($a); ?>;
            $("#country" + x).select2({
                data: arrayFromPHP
            });

            $(add_button).click(function(e){ //on add input button click
                e.preventDefault();

                if(x < max_fields){ //max input box allowed
                    x++; //text box increment

                    $(wrapper).append('' +
                        '<div>' +
                        '<select id="country'+ x +'" style="width:300px;" value="Selecteer uw artikel">' +
                        '</select>' +
                        '<a href="#" class="remove_field">Remove</a>' +
                        '</div>' +
                        '<div><input type="number" name="quantity'+ x +'" min="1" max="10"><a href="#" class="remove_field">Remove</a></div>'
                    );
                    //same code as above becouse need to apply this to the list again.
                    $("#country" + x).select2({
                        data: arrayFromPHP
                    });
                }

            });

            $(wrapper).on("click",".remove_field", function(e){ //user click on remove text
                e.preventDefault(); $(this).parent('div').remove(); x--;
            });
        });

            // THIS PART IS POST
            $(buttonpressed).click(function(e){ //on add input button click
                e.preventDefault();
                $.ajax({
                    type: "POST",
                    url: "submitsubform.php",
                    data: {teller: x},
                    success: function () {
                    }
                });
            });

    </script>

我在Post部分的代码中添加了注释。我也有这个HTML代码:

<form method="post">
        Bedreifsnaam:<br>
        <input type="text" id="Bedrijfsnaam" name="Bedrijfsnaam" value="Autobanden.nl" disabled><br>
        Email:<br>
        <input type="text" name="lastname" value="voorbeeld@mail.com" disabled><br>
        product:<br>
        <div class="input_fields_wrap">
            <!-- This is the button I count X on. -->
            <button name="counterknop" value="Add item" class="add_field_button">Add product</button>
            <div>
                <select id="country1" style="width:300px;">
                    <!-- Dropdown List Option -->
                </select>
            </div>
            <div><input type="number" name="quantity1" min="1" max="10"></div>
        </div>
        <br><br>
        <input type="submit" id="Totalform" name="Totalform" value="Submit">
    </form>

所以理论上我想要点击按钮来做x++这样做有效。然后通过POST将其发送到我的PHP文件并将值放在PHP变量中:

// This is in the index.php file like the Script and HTML
if(isset($_POST['Totalform']))
{
    include 'submitsubform.php';       
    echo 'test';
}

// This is in submitsubform.php
<?php
$var = $_POST['teller'];
echo $var;

所以在这一点上我尝试了很多调试,但似乎无法找到问题,我从这些代码中得到的唯一错误是:

  

注意:未定义的索引:第3行的C:\ xampp \ htdocs \ OIA \ submitsubform.php中的出纳员

因此,当我尝试多次单击按钮以增加x时,然后提交表单。它没有做任何事情。它只是给出了上述错误。

经过2到3个小时之后,我想我会在这里张贴这个,也许有人会看到我看不到的东西。

提前感谢并快乐编码!

附加1:

当我对发布的表单执行var转储时,它没有看到下拉菜单或2个普通文本字段。它只能看到“aantal”(数字字段)

  

array(3){[“quantity1”] =&gt; string(1)“3”[“quantity2”] =&gt; string(1)“1”[“Totalform”] =&gt; string(6)“Submit”}

编辑:

是我最后的脑力。我禁用了2个文本字段。但是,它仍然没有看到选择框作为一个字段,所以它用它发布它

4 个答案:

答案 0 :(得分:1)

你的ajax成功功能是空的

success: function () {}

所以你不能从ajaxed页面返回任何内容 你需要改变你的php和js来返回结果

尝试提醒ajax的结果

success: function (data) {
 alert(data);
}

如果在点击提交按钮后页面重定向,那么你就不会做ajax

答案 1 :(得分:1)

这只是因为你运行了两个请求。一个ajax与帖子,另一个帖子是html提交动作。所以html提交动作永远不会得到出纳员变量。您可以将teller变量作为隐藏输入插入,并且根本不执行ajax请求。

答案 2 :(得分:1)

我认为你无法获得x变量。它不是一个全局变量。

X变量仍在$(document).ready(function(){})标记

尝试删除该标记或将$(buttonpressed).click(function(e){});标记置于 $(document).ready(function(){})

希望这是帮助

答案 3 :(得分:0)

jQuery.ajax({      键入:&#34; POST&#34;,

 data: { "teller" : x},
 success: function () {
 }

});