jQuery的阿贾克斯保存到数据库

Question

我想创造一个儿童俱乐部，一个简单的考勤登记，当他们打开了他们需要记录谁在支付了晚上练习。这是或多或少的作品我想它，但我用最后一点挣扎。

当我点击按钮来为user_id添加到支付表，日期和和状态，它确实不如预期，所以都好那里。不过，我想按钮根据付费状态，这是我能做到买读取数据库值更改图标 -

<button type="button" class="btn btn-sm btn-success btn-status" id="<?php echo $row['user_id']; ?>" data-status="<?php echo $row['status']; ?>" title="Active/Deactive details" >
<?php if(empty($row['status'])){ ?>
    <i class="fa fa-thumbs-up" aria-hidden="true"></i>
<?php }else{ ?>
    <i class="fa fa-ban" aria-hidden="true"></i>
<?php } ?>

在按钮单击下面的jQuery处理事件后 -

    $(document).on('click', '.btn-status', function(ev){
    ev.preventDefault();
    var btn_button = $(this);
    var status = 1;
    btn_button.html(' <i class="fa fa fa-spinner fa-spin"></i> ');
    var tbl_id = $(this).attr("id");
    var tbl_status = $(this).data("status");
    if(tbl_status == 0) status = 1;
    else status = 0;

    $.post('save_details.php', { form_name: "user_status", tbl_id: tbl_id, status: status }, function(data,status){
        console.log(data);
        if(data == "1"){
            $('.warning-modal-message').html("Record status changed successfully.");
            $('#warningModal').modal('show');
            setTimeout(function(){  location.reload(); }, 2000);
        }
        else{
            $('.warning-modal-message').html("Data deletion failed.");
        }
    });
});

和PHP数据库 -

    if($form_name == "user_status"){
    $tbl_id = mysql_real_escape_string($_POST['tbl_id']);
    $status = mysql_real_escape_string($_POST['status']);

    $query = "insert into attendance(rider_id, at_status, at_date) values('$tbl_id','$status',NOW())";
    $result = mysql_query($query) or die(mysql_error());
    if($result)
        echo "1";
    else
        echo "0";
}

我遇到的问题是查询依赖于状态字段的用户信息表，以控制该图标是可见的。我需要的是一个方法，有设置为FA-禁令图标页面重新加载，当按钮被按下取考勤拇指图标的所有图标。

我尝试了$row['status'];设置为1手动，我试图引导拨动开关，引导切换按钮，对这里的文章负载，但我没有任何运气

Answer 1

我设法让尽可能使用引导拨动开关需要它的工作或多或少 -

<input type="checkbox" id="<?php echo $row['user_id']; ?>" class="toggleBtn" name="toggleBtn" data-toggle="toggle" data-on="Paid Fees" data-off="Unpaid" data-onstyle="success" data-offstyle="danger" data-size="small" > 

使用下面的jQuery -

    $(document).on('change', '.toggleBtn', function(ev){
    ev.preventDefault();

    // Disable switch on click to help prevent multiple submit
    $(this).bootstrapToggle('disable');

    //var btn_button = $(this);
    var status = $(this).prop('checked');
    //btn_button.html(' <i class="fa fa fa-spinner fa-spin"></i> ');
    var tbl_id = $(this).attr("id");
    var tbl_status = $(this).data("status");
    //if(tbl_status == 0) status = 1;
    //else status = 0;

    $.post('save_details.php', { form_name: "user_status", tbl_id: tbl_id, status: status }, function(data,status){
        console.log(data);
        if(status == "checked"){
            $('.warning-modal-message').html("Record status changed successfully.");
            $('#warningModal').modal('show');
            setTimeout(function(){  location.reload(); }, 2000);
        }
        else{
            $('.warning-modal-message').html("Data deletion failed.");
        }
    });
});

而下面的PHP -

if($form_name == "user_status"){
    $tbl_id = mysql_real_escape_string($_POST['tbl_id']);
    $status = mysql_real_escape_string($_POST['status']);

    //SELECT * FROM `attendance` WHERE `rider_id` = 1 AND `at_date` = DATE(NOW())

    $result = "SELECT * FROM `attendance` WHERE `rider_id` = '$tbl_id' AND `at_date` = DATE(NOW())";
    $total = ($result);

    if($total==0){
        $query = "insert into attendance(rider_id, at_status, at_date) values('$tbl_id','$status',NOW())";
        $result = mysql_query($query) or die(mysql_error());
    }

    //$query = "insert into attendance(rider_id, at_status, at_date) values('$tbl_id','$status',NOW())";
    //$result = mysql_query($query) or die(mysql_error());
    //if($result)
        //echo "1";
    //else
        //echo "0";
}

一对夫妇的我现在遇到的问题是，这些警告没有显示出来和$ QRY检查骑手已经在当天进入（开关都在页面刷新重置！

    if(status == "checked"){
    $('.warning-modal-message').html("Record status changed successfully.");
    $('#warningModal').modal('show');
    setTimeout(function(){  location.reload(); }, 2000);
}
else{
    $('.warning-modal-message').html("Data deletion failed.");
}

谢谢！