Question

更新：好的，感谢下面的OneSneakyMofo的帮助，我设法使用ajax来调用submit.php表单并让它返回例如一个echo语句。我的问题是没有我的$ post值被转移，例如，如果我用if（isset（$ _ POST ['pizzacrustformid']））启动我的php脚本{javascript将返回空白，同样当我执行var_dump时（$ _POST）;,没有任何东西被保存到它，这意味着数据没有被转移，PHP脚本正在被调用。请告诉我是否有什么需要做的，以便从表单中获取POST信息，就像＆LT;提交＆gt;按钮传统上。我已经在Github上更新了我的代码以反映我的进度。 https://github.com/dhierholzer/Basiconlineordering再次感谢！

原始邮寄：我是新手使用jquery并提交表单而不加载新页面/刷新页面。

在我的代码中，我在一个页面上有多个表单，通过点击下一个按钮，通过淡入和淡出效果一次显示一个。

我现在的问题是我这样做了，当点击下一个按钮将这些表单选项保存到会话中时，我似乎无法激活PHP脚本。

所以这是一个例子：

<!--First Pizza Form, Pick Pizza Crust Type-->
<div id="pizzacrust">
      <form method="post" name="pizzacrustform" id="pizzacrustformid">  
        <div id="main">
            <div class="example">
              <div>
                <input id="freshpizza" type="radio" name="pizzacrust" value="1" checked="checked"><label style="color:black" for="freshpizza"><span><span></span></span>Fresh Dough</label>
              </div>
              <div>
                <input id="originalpizza" type="radio" name="pizzacrust" value="2"><label style="color:black" for="originalpizza"><span><span></span></span>Original</label>
              </div>
              <div>
                <input id="panpizza" type="radio" name="pizzacrust" value="3"><label style="color:black" for="panpizza"><span><span></span></span>Deep Dish Pan</label>
              </div>              
            </div>
        </div>
     </form>                  
</div>
<div><button href="#" id="btn">Show Pizza Size</button></div>

所以这是我的第一个表格，要注意的一件事是，而不是＆lt;提交＆gt;按钮，我使用普通按钮并使用javascript来提交部分。

以下是Javascript：

 <!--Controls All Button Fades-->
 $('#btn').click(function(e){    
    $('#pizzacrust, #btn').fadeOut('slow', function(){
        $('#pizzasize, #btn2').fadeIn('slow');
        $('#pizzacrustformid').submit();        
    });
});

然后：

$(document).ready(function () {
    $('#pizzacrustformid').on('submit', function(e) {
        e.preventDefault();

    });
});

现在传统上是一个php程序员，我只是在我的表单中有一个按钮然后我的php激活了类似的东西：

if (isset($_POST['submitted'])) { //MY Code To save values into sessions}

我似乎无法通过javascript函数提交表单时使用的功能正常工作。

这是我的GitHub中的完整代码，可以让您更容易看到这些表单现在如何协同工作。

https://github.com/dhierholzer/Basiconlineordering

请让我知道任何可能的解决方案再次感谢。

Answer 1

修改

OP，看起来你想要做AJAX，但你没有任何地方可以提交你的AJAX。首先，您需要创建一个接受表单的文件。

我们称之为submit.php。

有了这个，你就可以开始处理AJAX了。首先，您需要将代码与index.php分开。

将其从index.php中取出并放入submit.php：

if (isset($_POST['pizzacrustformid'])) { // use a foreach loop to read and display array elements echo '<p>hello!<p>'; }

在您的Javascript中，您需要执行以下操作：

$('#btn').click(function(e){ $.ajax({ method: "POST", url: "some.php", data: $('#pizzacrustformid').serializeArray() }) .done(function(data) { alert(data); //should be "Hello world" $('#pizzacrust, #btn').fadeOut('slow', function(){ $('#pizzasize, #btn2').fadeIn('slow'); }); }) .fail(function() { alert( "error" ); }) .always(function() { alert( "complete" ); });

}）;

这里发生的是提交，您的表单数据将传递到submit.php页面，它将生成PHP代码。该代码将点击完成功能（如果成功），调用警报，然后淡出到下一部分。

这应该让你走上正确的道路。我会创建另一个分支并删除所有表单，并在继续之前完成这项工作。

另外，我会将这一切设置在一个单一的表单中并显示第一部分，进行一些验证，然后继续进行下一部分，最后提交您需要的传送。

希望这有帮助。

Answer 2

我建议您通过ajax提出请求，这里有一个教程和示例： http://www.w3schools.com/jquery/jquery_ajax_get_post.asp

删除有关提交

的所有jquery函数

使用php代码

创建一个名为blu.php的文件

在index.php中添加jquery代码

有了这个你最后只做一次请求。我希望这会对你有所帮助。

<?php echo 'tus datos son: '; 
echo ' '.$_POST["data1"]; 
echo ' '.$_POST["data2"]; 
echo ' '.$_POST["data3"]; ?>


<script>
    $(document).ready(function(){
    $("#btn5").click(function(){

        var pizzacrust= $('input[name="pizzacrust"]:checked').val();
        var pizzasize= $('input[name="pizzasize"]:checked').val();
        var pizzatoppings= $('input[name="pizzatoppings"]:checked').val();


        $.post("blu.php",
        {
          data1: pizzacrust,
          data2: pizzasize,
          data3: pizzatoppings
        },
        function(data,status){
            alert("Data: " + data);
        });
    });
    });
    </script>

Answer 3

我认为你需要使用click（）func调用ajax，不要使用on（）提交。提交操作会使当前页面刷新。我稍后会审核您的代码，但您应该尝试上面的解决方案。

获取Javascript / jQuery和PHP一起工作

3 个答案: