2017-06-30 54 views
0

现在挣扎几天,然后编辑一些代码来发送我的表单到process.php,然后将结果重新加载到表单所在的div中。 我正在使用引导程序布局,不希望页面重新加载/去process.php表单提交结果以加载div

HTML表单正在工作,而不是通过ajax调用,因此form和process.php是可以的。 唯一的事情是我在过程中检查

$_POST['toevoegen'] == "training toevoegen" 

,因为更多的形式去process.php如果我成功转移到它。

HTML表格只是一个快照,它有更多的值。

<form id="form1" name="form1" method="post" action="process.php"> 
     <label>datum:</label> 
     <input name="datum" id="datum" size="10" type="text" autocomplete="off" /><br><br> 
     <label>club:</label> 
     <select name="clubid" id="club-list" onChange="gettrainer(this.value);"> 
     <option value="">Selecteer club</option> 
     <?php 
     foreach($results as $club) { 
     ?> 
     <option value="<?php echo $club["id"]; ?>"><?php echo $club["clubnaam"]; ? ></option> 
     <?php 
     } 
     ?> 
<input type="submit" id="submit" name="toevoegen" value="training toevoegen" /> 
</form> 

ajax调用是这样的,但是暂时不起作用。

<script> 
     $(document).ready(function() { 

     $('#form1').on('submit', function (e) { 

      e.preventDefault(); 
      var form1 = document.getElementById("form1"); 
      var fd = new FormData(form1); 

      $.ajax({ 
      type: 'POST', 
      url: 'process.php', 
      data: fd, 
       success: function (response) { 
      $("#main").html(response); 
      } 
      }); 

     }); 

     }); 
    </script> 
+0

_“唯一的事情是我在过程中检查 $ _ POST [ 'toevoegen'] “ - - 这就是问题;因为您在这里对表单提交事件作出反应,所以提交按钮值不包含在您用'新FormData(form1)'构建的数据集中。解决这个问题的最简单方法是在表单中使用隐藏字段来指示在服务器端执行什么操作,因此这不取决于表单实际上是如何提交的。 – CBroe

+0

谢谢@CBroe,但现在我得到一个错误,像参数是不是可选的jQuery中。所以我认为我的某个地方仍然有一个错误? –

+0

什么说法,在哪里? – CBroe

回答

0

更改的数据字段的数据:$( '#Form1的')序列化(),

<script> 
     $(document).ready(function() { 

     $('#form1').on('submit', function (e) { 

      e.preventDefault(); 
      $.ajax({ 
      type: 'POST', 
      url: 'process.php', 
      data: $('#form1').serialize(), 
       success: function (response) { 
      $("#main").html(response); 
      } 
      }); 

     }); 

     }); 
    </script>