Jquery, Ajax сохранить в базе данных

0

Я пытаюсь создать простой регистр посещаемости для детского клуба, когда они приходят на тренировочную сессию, которую им нужно записать, кто заплатил за ночь. Это более или менее работает, как я хочу, но я борюсь с последним битом.

Когда я нажимаю на кнопку, чтобы добавить 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 обрабатывает событие post -

    $(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-ban при перезагрузке страницы и значок большого пальца, когда кнопка нажата, чтобы принять участие.

У меня есть попытки установить $row['status']; 1, я попробовал Bootstrap Toggle Switch, Bootstrap Toggle Button и множество статей здесь, но мне не повезло

Теги:

1 ответ

0

Мне удалось заставить его работать более или менее по мере необходимости с помощью Bootstrap Toggle Switch -

<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.");
}

Спасибо!

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню