如何使用ajax处理来自多个复选框和多个提交的数据

时间:2019-02-18 16:46:32

标签: php jquery ajax button checkbox

我正在尝试使用多个提交按钮发布来自多个复选框的数据。 重要的是:“提交”按钮不属于表单,因为它们位于网站的其他位置。

这是我到目前为止所拥有的:

<form class="checkboxform" action="" method="post">
   <input type="checkbox" name="check_list[]" value="C/C++"><label>C/C++</label><br/>
   <input type="checkbox" name="check_list[]" value="Java"><label>Java</label><br/>
   <input type="checkbox" name="check_list[]" value="PHP"><label>PHP</label><br/>
</form>

提交按钮:

<button type="button" id="delete" name="delete" onclick="submitForm()" value="Delete"/>Delete</button>
<button type="button" id="move" name="move" onclick="submitForm()" value="Move"/>Move</button>
<button type="button" id="copy" name="copy" onclick="submitForm()" value="Copy"/>Copy</button>

ajax:

function submitForm(url){
   var data = $(".checkboxform").serialize();
   $.ajax({
    type : 'POST',
    url  : url,
    data: data,
    success :  function(data){
        $(".echo").html(data);
       }
   });
};

php:

if($_POST['delete']) {
  if(isset($_POST['check_list'])){//to run PHP script on submit
    if(!empty($_POST['check_list'])){
    // Loop to store and display values of individual checked checkbox.
        foreach($_POST['check_list'] as $selected){
        echo $selected."</br>";
        }
        // code for delete goes here
        echo 'Files are  deleted!';
    }
  }
}

if($_POST['move']) {
  if(isset($_POST['check_list'])){//to run PHP script on submit
    if(!empty($_POST['check_list'])){
    // Loop to store and display values of individual checked checkbox.
        foreach($_POST['check_list'] as $selected){
        echo $selected."</br>";
        }
        //code for moving files goes here
        echo 'Files are moved!';
    }
  }
}

if($_POST['copy']) {
  if(isset($_POST['check_list'])){//to run PHP script on submit
    if(!empty($_POST['check_list'])){
    // Loop to store and display values of individual checked checkbox.
        foreach($_POST['check_list'] as $selected){
        echo $selected."</br>";
        }
        // code for copy goes here
        echo 'Files are copied!';
    }
  }
}

通过提交,php不处理数据。我做错了什么?有人可以帮我吗?

所有代码都在同一个文件中,名为index.php

1 个答案:

答案 0 :(得分:0)

您的js函数有一个参数

function submitForm(url){

但是当您调用函数时,没有设置参数

 onclick="submitForm()"

由于该参数是将POST发送到的URL,因此它永远不会到达那里。您可能应该在浏览器开发人员窗口中看到一些错误。 F12打开开发人员窗口。

在运行相同的PHP脚本时,无论它是删除,移动还是复制。我将删除参数,并在函数中将URL硬编码为这样。

function submitForm(){
   var data = $(".checkboxform").serialize();
   $.ajax({
    type : 'POST',
    url  : 'path/to/the.php',
    data: data,
    success :  function(data){
        $(".echo").html(data);
       }
   });
};