从AJAX向PHP发送变量时出错

时间:2017-06-08 09:44:42

标签: javascript php jquery ajax

我使用数据库中的数据生成表格行。

以下是我的代码:

<table class="table table-hover" id="dashEventTable">
    <thead>
        <tr>
            <th>Created at</th>
            <th>Seminar Name</th>
            <th>Quota</th>
            <th>Location</th>
            <th>Option</th>
            <th style="display:none"></th>
        </tr>
    </thead>
    <tbody script="javascript">
    <?php
    $one = 1;
    $Lihat="SELECT * FROM event where status = '$one'";
    $Tampil = mysqli_query( $db, $Lihat );
        while ( $hasil = mysqli_fetch_array ( $Tampil ) ) {
            $id_event = ( $hasil['id_event'] );
            $nama_event =  ( $hasil['nama_event'] );
            $lokasi =  ( $hasil['lokasi'] );
            $kuota  =  ( $hasil['kuota'] );
            $created_at =  ( $hasil['created_at'] );
            { ?>
        <tr>
            <td class="created_at"><?php echo date( 'Y-m-d h:i a', strtotime( $created_at ) ); ?></td>
            <td class="event_name"><?php echo "$nama_event"; ?></td>
            <td class="kuota"><?php echo "$kuota"; ?></td>
            <td class="lokasi"><?php echo "$lokasi"; ?></td>
            <td>
                <a class="btn btn-xs btn-danger btn_delete" data-toggle="modal" href="#deleteDashEvent"><i class="fa fa-trash"></i></a>
            </td>
            <td class="event_id" style="display:none"><?php echo "$id_event"; ?></td>
        </tr><?php }
        } ?>
    </tbody>
</table>

现在当我点击行内的按钮时,它会做两件事,第一件就是这个JavaScript函数:

$( ".btn_delete" ).click(function() {
    var $row = $( this ).closest( "tr" ); // Find the row
    var event_id = $row.find( ".event_id" ).text();
    console.log( event_id );
    $.ajax({
        url: "contain_data.php",
        method: 'post',
        data: {
            'send': event_id
        },
        success: function() {
            alert( event_id );
        }
    });
});

从警报和控制台日志中,我看到我获得了行的事件ID的正确ID。然后数据将被发送到上面的PHP文件,在PHP里面就是这样:

<?php
if ( isset( $_POST['send'] ) ) {
    $id_event = $_POST['send'];
} else {
    echo "The data has not been received!";
}

它做的第二件事就是去div这个删除确认:

<form action="admin_delete_event.php" enctype="multipart/form-data" id="event_delete_row" method="post" name="delete_event_row">
    <div class="modal fade" id="deleteDashEvent">
        <div class="modal-dialog modal-sm" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button aria-label="Close" class="close" data-dismiss="modal" type="button">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title">Delete Confirmation</h4>
                </div>
                <div class="modal-body">
                    <p>Are you sure want to delete this event?</p>
                </div>
                <div class="modal-footer">
                    <a class="btn btn-default" data-dismiss="modal" href="#">Batal</a>
                    <button class="btn btn-primary btn_confirm_delete" name="admin_delete_event" type="submit">DELETE</button>
                </div>
            </div>
        </div>
    </div>
</form>

单击DELETE按钮后,它将转到此PHP文件:

<?php
session_start();
include( "config.php" );

if ( isset( $_POST['admin_delete_event'] ) ) {
    include( "contain_data.php" );

    $zero = 0;

    $delete_query = "UPDATE event, jadwal_acara, waktu_pendaftaran
        SET event.status = '$zero', jadwal_acara.status = '$zero', waktu_pendaftaran.status = '$zero'
        WHERE event.id_event = '$id_event'
        AND jadwal_acara.id_event = '$id_event'
        AND waktu_pendaftaran.id_event = '$id_event'";

    if ( mysqli_query( $db, $delete_query ) ) {
        $delete = "Data has been deleted";
        echo $delete;
    } else {
        echo "Error: " . $delete_query . "<br>" . mysqli_error( $db );
    }
} else {
    echo "The button is not detected!";
}

我遇到的问题是当我点击删除确认按钮时收到此错误:

  

尚未收到数据!
  未定义的变量:id_event in ...

这意味着我无法发送数据。

我做错了什么,如何解决?

编辑:在对php文件添加错误处理之后,ajax发送的值为null而不是id_event,你们知道为什么吗?

2 个答案:

答案 0 :(得分:1)

使用以下方式更新您的AJAX:

 $.ajax({
        url: "contain_data.php",
        method: 'post',
        data : 'send='+event_id,
        success:function(){
            alert(event_id);
        }
    });

尝试使用这种方式传递您的event_id

data : 'send='+event_id,

因为你已经

method: 'post',

希望它会有所帮助

答案 1 :(得分:0)

我收到了你的错误。提交你的第一个表格是正确的当你去删除确认你错过了event_id而你只是在你的“admin_delete_event.php”文件中使用那个为什么它给出错误

  

未定义的变量:id_event in ...

现在只需在表单中添加一个隐藏的输入字段并提交,然后就可以使用event_id了。

    <form action="admin_delete_event.php" enctype="multipart/form-data" id="event_delete_row" method="post" name="delete_event_row">
        <div class="modal fade" id="deleteDashEvent">
            <div class="modal-dialog modal-sm" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button aria-label="Close" class="close" data-dismiss="modal" type="button">
                            <span aria-hidden="true">&times;</span>
                        </button>
                        <h4 class="modal-title">Delete Confirmation</h4>
                    </div>
                    <div class="modal-body">
                        <p>Are you sure want to delete this event?</p>
                    </div>
                    <div class="modal-footer">
                        <a class="btn btn-default" data-dismiss="modal" href="#">Batal</a>
                        <button class="btn btn-primary btn_confirm_delete" name="admin_delete_event" type="submit">DELETE</button>
                    </div>
                </div>
            </div>
        </div>
        <input type="hidden" name='event_id' value='id' id='event'>
    </form>

只需在第一个Ajax中更改此内容

        $( ".btn_delete" ).click(function() {
        var $row = $( this ).closest( "tr" ); // Find the row
        var event_id = $row.find( ".event_id" ).text();
        console.log( event_id );
        $.ajax({
            url: "contain_data.php",
            method: 'post',
            data: {
                'send': event_id
            },
            success: function() {
                $('#event').val(event_id);
                alert( event_id );
            }
        });
    });

然后它会正常工作。