Fatal编程技术网
  • php/
  • 通过JQuery将复选框数据从datatable发送到php文件

通过JQuery将复选框数据从datatable发送到php文件

php jquery mysql ajax datatables

通过JQuery将复选框数据从datatable发送到php文件,php,jquery,mysql,ajax,datatables,Php,Jquery,Mysql,Ajax,Datatables,我检查了其他类似的问题，但找不到一个对我有帮助的解决方案 我试图从我的数据库中获取数据，并将它们插入到添加到我的数据表中的两个不同输入（复选框类型）中。我希望这两个输入包含在我的表单中，并将信息发送到一个.php文件，并将其放置在数据库的另一个表中。 我可以将“原始”表单的数据发送到.php文件，但在查找复选框输入的值时遇到了问题 $(document).ready(function(){ $.ajax ({ url: "dati_education.php",

我检查了其他类似的问题，但找不到一个对我有帮助的解决方案

我试图从我的数据库中获取数据，并将它们插入到添加到我的数据表中的两个不同输入（复选框类型）中。我希望这两个输入包含在我的表单中，并将信息发送到一个.php文件，并将其放置在数据库的另一个表中。 我可以将“原始”表单的数据发送到.php文件，但在查找复选框输入的值时遇到了问题

  $(document).ready(function(){
      $.ajax ({
        url: "dati_education.php",
        metod: "POST",
        dataType: "json",
        success: function(data) {
            $("#education").dataTable({
                data: data,
                columns: [
                    { 'data' : 'Title' },
                    { 'data' : 'Year' },
                    { 'data' : "Place" },
                    { 'data' : '  ',
                        'render': function(data, type, row){
                            return "<input class='check' id = '"+row.education_id+"'name='edu_id' type='checkbox' onclick= 'return "+ row.education_id + "'/>";
                        }

                    }
                ],
                paging: true
            })
         }
        });

       $.ajax ({
        url: "dati_work.php",
        metod: "POST",
        dataType: "json",
        success: function(data) {
            $("#work").dataTable({
                data: data,
                columns: [
                    { 'data' : 'Company' },
                    { 'data' : 'Role' },
                    { 'data' : 'Year' },
                    { 'data' : 'Place'},
                    { 'data' : '  ',
                        'render': function(data, type, row){
                            return "<input class='chk'name='work_id' type='checkbox' onclick='return "+ row.work_id + "'/>";
                        }

                    }
                ],
                paging: true
            })
         }
    });
});

        var id1 = 0;
        $('#edu_id').on('click', function(){

            id1 = $(".check:checked").each(function(){
                    $(this).find('input[type="checkbox"]').val();
                });

        });

     //I add some console.log() to do some tests.

        var id2= 0;
        var work =[];
        console.log('ciao');
        $('#work_id').on('click', function(){
                 console.log('ciao');
            $(".chk:checked").each(function(){
                var id2 = $(this).attr("id");
                //var id =$(this).find('input[type="checkbox"]').val();

                console.log(id2);
                work = JSON.stringify(id2);
                work[0] = id2;
                });

        });
        var data =  $("#Form").serializeArray(); 

        console.log(id1);
        console.log(work);

        data.push({
            name : "edu_id",
            value: id1
        });
        data.push({
            name : "work_id",
            value: work
        });

        console.log(data);
    $("#Form").on("submit", function(){

                    $.ajax({
                        type: "POST",
                        url: "create_cards.php",
                        data: data,
                        success: function(data){
                            alert(data);
                            //alert('Finished! Starting over!');
                        }
                    });

                }); 

$（文档）.ready（函数（）{
$.ajax({
网址：“dati_education.php”，
梅托德：“帖子”，
数据类型：“json”，
成功：功能（数据）{
$（“#教育”）。数据表({
数据：数据，
栏目：[
{“数据”：“标题”}，
{“数据”：“年份”}，
{'data'：“Place”}，
{“数据”：“，
“呈现”：函数（数据、类型、行）{
返回“”；
}
}
],
分页：对
})
}
});
$.ajax({
url:“dati_work.php”，
梅托德：“帖子”，
数据类型：“json”，
成功：功能（数据）{
$（“#工作”）.dataTable({
数据：数据，
栏目：[
{“数据”：“公司”}，
{“数据”：“角色”}，
{“数据”：“年份”}，
{'data'：'Place'}，
{“数据”：“，
“呈现”：函数（数据、类型、行）{
返回“”；
}
}
],
分页：对
})
}
});
});
变量id1=0；
$（'edu_id'）。在（'click'，function（）上{
id1=$（“.check:checked”）.each（函数（）{
$（this.find（'input[type=“checkbox”]）.val（）；
});
});
//我添加了一些console.log（）来做一些测试。
变量id2=0；
var功=[]；
console.log（'ciao'）；
$（'#工作id'）。在（'单击'，函数（）上）{
console.log（'ciao'）；
$（“.chk:checked”）。每个（函数（）{
var id2=$（this.attr（“id”）；
//var id=$（this.find（'input[type=“checkbox”]”）val（）；
console.log（id2）；
work=JSON.stringify（id2）；
功[0]=id2；
});
});
var data=$（“#Form”）.serializeArray（）；
console.log（id1）；
控制台日志（工作）；
数据推送({
名称：“教育部id”，
值：id1
});
数据推送({
姓名：“工作id”，
价值观：工作
});
控制台日志（数据）；
$（“#表格”）。关于（“提交”，函数（）{
$.ajax({
类型：“POST”，
url:“create_cards.php”，
数据：数据，
成功：功能（数据）{
警报（数据）；
//警报（'完成！重新开始！'）；
}
});
});
如您所见，我尝试使用两种不同的方法尝试获取复选框的值，但两种方法都不起作用。我认为使用“serializeArray”方法是正确的，因为从控制台我可以看到它添加了字段。但我仍然无法从复选框中获取值

以下是我的HTML代码：

    <div class="container">
<div class="row">
    <form id="Form" class="form-horizontal" action="create_cards.php" method="POST">
        <div class="col-sm-6">
            <br> <br> <br> <br> <br>
                <div class="form-group">
                  <label class="control-label col-sm-2" for="title">Title:</label>
                  <div class="col-sm-10">
                    <input type="text" class="form-control" id="title" placeholder="Enter the Title" name="title">
                  </div>
                </div>
                <div class="form-group">
                  <label class="control-label col-sm-2" for="name">Name:</label>
                  <div class="col-sm-10">          
                    <input type="text" class="form-control" id="name" placeholder="Enter your Name" name="name">
                  </div>
                </div>
                 <div class="form-group">
                  <label class="control-label col-sm-2" for="surname">Surname:</label>
                  <div class="col-sm-10">          
                    <input type="text" class="form-control" id="surname" placeholder="Enter your Surname" name="surname">
                  </div>
                </div>
                 <div class="form-group">
                  <label class="control-label col-sm-2" for="email">Email:</label>
                  <div class="col-sm-10">          
                    <input type="email" class="form-control" id="email" placeholder="Enter your Email" name="email">
                  </div>
                </div>
                <div class="form-group">
                  <label class="control-label col-sm-2" for="phone">Phone:</label>
                  <div class="col-sm-10">          
                    <input type="phone" class="form-control" id="phone" placeholder="Enter your Phone" name="phone">
                  </div>
                </div>
                 <div class="form-group">
                  <label class="control-label col-sm-2" for="photo">Photo:</label>
                  <div class="col-sm-10">          
                    <input type="select" class="form-control" id="photo" placeholder="Enter your Photo" name="photo">
                  </div>
                </div>
                 <div class="form-group">
                  <label class="control-label col-sm-2" for="note">Note:</label>
                  <div class="col-sm-10">          
                    <input type="text" class="form-control" id="note" placeholder="Enter some Note" name="note">
                  </div>
                </div>
                <div class="form-group">        
                  <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-default">Submit</button>
                  </div>
                </div>
        </div>
        <div class="col-sm-6">
            <table  class="table table-hover table-border" id="education">
                <thead>
                    <tr>
                        <th>Title</th>
                        <th>Year</th>
                        <th>Place</th>
                        <th> </th>
                    </tr>
                </thead>
                <tbody>
                    <td></td>
                </tbody>
            </table>
            <table  class="table table-hover" id="work">
                <thead>
                    <tr>
                        <th>Company</th>
                        <th>Role</th>
                        <th>Year</th>
                        <th>Place</th>
                        <th>  </th>
                    </tr>
                </thead>
            </table>
        </div>
    </form>
</div>








标题：
姓名：
姓：
电邮：
电话：
照片:
注:
提交
标题
年
放置
单位
角色
年
放置
下面是我从中获取数据以插入数据表的一个文件（另一个完全相同）：

我认为您需要在复选框中添加一个值=“”。返回“”；非常感谢，但还是不行！另外，它不再在控制台上打印返回。

<?php 
include("database.php");
$conn = mysqli_connect($db_host, $db_user, $db_password);
mysqli_select_db($conn, $db_database);
session_start();
$query =  "select * from education_experience where user_id = '" 
.$_SESSION["user_id"] ."'";
$result = mysqli_query($conn, $query);
$dati = array();
while($row = mysqli_fetch_array($result, MYSQLI_ASSOC)){
$dati[] = array(

"Title" => $row['title'],
    "Year" => $row['year'],
    "Place" => $row['place'],
    "education_id" => $row['education_experience_id']

);
}

echo json_encode($dati);

?>



<?php

include("database.php");

$conn = mysqli_connect($db_host, $db_user, $db_password);
mysqli_select_db($conn, $db_database);

session_start();

echo "CIAO";

if(isset($_POST['title']) && isset($_POST['name']) && 
isset($_POST['surname']) && isset($_POST['email']) && isset($_POST['phone']) ) {

$Title = mysqli_escape_string($conn, $_POST['title']);
$Name = mysqli_escape_string($conn, $_POST['name']);
$Surname = mysqli_escape_string($conn, $_POST['surname']);
$Email = mysqli_escape_string($conn, $_POST['email']);
$Phone = mysqli_escape_string($conn, $_POST['phone']);
$Photo = mysqli_escape_string($conn, $_POST['photo']);
$Note = mysqli_escape_string($conn, $_POST['note']);
$Edu_id = mysqli_escape_string($conn, $_POST['edu_id']);
$Work_id = mysqli_escape_string($conn, $_POST['work_id']);


echo $Title, $Name, $Edu_id, $Work_id;
}
?>