Datatables Custom Button Action中的Ajax

时间:2017-08-18 20:00:12

标签: javascript php jquery ajax datatable

我想将数据表数据存储在数组或json格式中,并使用它传递给php以获取 FPDF 。在我的数据表中,我创建了一个名为" PDF"的自定义按钮,当按钮单击时,我想存储数据并通过post将其传递给php。我有这个代码,但如果我把ajax放在我制作的自定义按钮的动作功能中,它就无法工作。它没有去我声明的网址。这是代码:

EDITED

    <script>
    $(document).ready(function() {
        var table = $('#stud_list').DataTable({
            dom: 'Blfrtip',
            columnDefs: [{
                targets: 1,
                className: 'noVis'
            }],
            buttons: [{
                    extend: 'excelHtml5',
                    exportOptions: {
                        columns: ':visible'
                    }
                },
                {
                    extend: 'csvHtml5',
                    exportOptions: {
                        columns: ':visible'
                    }
                },
                {
                    text: 'PDF',
                    exportOptions: {
                        columns: ':visible'
                    },
                    action: function(e, dt, node, config) {
                       $.ajax({
                            url: 'pdfViewStudent.php',
                            type: 'post',
                            data: table.row().data().toArray(),
                            dataType: 'json',
                            success: function(returnedData) {
                                console.log(returnedData);
                            }
                        });
                    }
                },
                'colvis'
            ],
            columnDefs: [{
                targets: -1,
                visible: false
            }],
            initComplete: function() {
                this.api().columns([4, 5, 6]).every(function() {
                    var column = this;
                    var select = $('<select><option value=""></option></select>')
                        .appendTo($(column.footer()).empty())
                        .on('change', function() {
                            var val = $.fn.dataTable.util.escapeRegex(
                                $(this).val()
                            );

                            column
                                .search(val ? '^' + val + '$' : '', true, false)
                                .draw();
                        });

                    column.data().unique().sort().each(function(d, j) {
                        select.append('<option value="' + d + '">' + d + '</option>')
                    });
                });
            }
        });
    });

</script>

我编辑了代码,错误消失了,但也没有发生。

添加HTML代码:

<table id="stud_list" class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th>ID</th>
                                        <th>Last Name</th>
                                        <th>First Name</th>
                                        <th>Initials</th>
                                        <th>Grade</th>
                                        <th>Section</th>
                                        <th>Gender</th>
                                        <th>Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <?php 
                                        $result = mysqli_query($connect, "SELECT * FROM tbl_student") or die(mysqli_error());

                                        while($row = mysqli_fetch_array($result,MYSQLI_ASSOC)){
                                        ?>
                                    <tr>
                                        <td>
                                            <?php echo $row['student_id']; ?>
                                        </td>
                                        <td>
                                            <?php echo $row['last_name']; ?>
                                        </td>
                                        <td>
                                            <?php echo $row['first_name']; ?>
                                        </td>
                                        <td>
                                            <?php echo $row['Initials']; ?>
                                        </td>
                                        <td>
                                            <?php echo $row['gradeLevel_id']; ?>
                                        </td>
                                        <td>
                                            <?php echo $row['section_id']; ?>
                                        </td>
                                        <td>
                                            <?php echo $row['gender']; ?>
                                        </td>
                                        <td>
                                            <a class="btn btn-success btn-xs" href="studentProfile.php?studId=<?php echo $row['student_id']; ?>"><i class="fa fa-eye fa-1x"></i></a>
                                            <button type="button" class="btn btn-info btn-xs" data-toggle="modal" data-target="#editStudent" data-studaydi="<?php echo $row['student_id']; ?>" data-cardaydi="<?php echo $row['card_id']; ?>" data-seksyon="<?php echo $row['section_id']; ?>" data-gardyan="<?php echo $row['Parents_No']; ?>" data-location="<?php echo $row['address']; ?>" data-ln="<?php echo $row['last_name']; ?>" data-fn="<?php echo $row['first_name']; ?>" data-mn="<?php echo $row['Initials']; ?>" data-gn="<?php echo $row['gender']; ?>" data-cy="<?php echo $row['cyear']; ?>" data-gr="<?php echo $row['gradeLevel_id']; ?>"><i class="fa fa-edit fa-1x"></i></button>
                                            <a onclick="javascript: return confirm('DO YOU REALLY WANT TO DELETE THIS STUDENT?');" href="removeStudent.php?id=<?php echo $row['student_id']; ?>" class="btn btn-danger btn-xs"><i class="fa fa-remove fa-1x"></i></a>
                                        </td>
                                        <?php } ?>
                                    </tr>
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                        <th></th>
                                    </tr>
                                </tfoot>
                            </table>

0 个答案:

没有答案