Значение флажка инвертируется на основе данных, вводимых пользователем, JavaScript должен знать, когда он установлен - PullRequest
0 голосов
/ 19 сентября 2018

Добрый вечер,

У меня есть сценарий, когда пользователи устанавливают флажок для ввода строки данных (или обновления строки данных) в базу данных MySQL через SparkJava / Java.Все работает, как и ожидалось, за исключением одной маленькой проблемы.

Если значение уже существует в базе данных, флажок является противоположностью того, что должно быть.Так, например ... Когда пользователь впервые нажимает на флажок, он добавляет его в базу данных.Однако если вы обновите страницу, она попытается добавить ее снова, а не удалять.

Я почти уверен, что проблема в следующей строке:

var newValue = $(this).is(':checked') ? "add" : "remove";

Но я не уверен, как заставить JavaScript знать, проверено ли уже значение.Обратите внимание, что я уже делаю эту проверку с условным оператором Velocity в моем HTML (эта функция работает, как и ожидалось).

#if ($amiibo.Collected == "Y")
<div class="star has-text-warning" id="star$amiibo.AmiiboID">
#else
<div class="star" id="star$amiibo.AmiiboID">
#end

Ниже приведен полный фрагмент из моего Javascript:

$(document).ready(function(){
    $( ".mine" ).change(function() {

     var newValue = $(this).is(':checked') ? "add" : "remove";

        var amiibo = $(this).attr('id');
        var activeAmiiboID = amiibo.split('#')[1];
        var activeAmiiboName = amiibo.split('#')[2];
        $("#star"+activeAmiiboID).toggleClass("has-text-warning");
        console.log( "Handler for .change() called with value: " + newValue );
        console.log("activeAmiiboID is: "+ activeAmiiboID);
        console.log("Sending request to backend");
        if (newValue == 'add') {
            VanillaToasts.create({
                title: 'Added to Favorites',
                text: activeAmiiboName + ' has been added to your Collection.',
                timeout: 4000,
                type: 'success',
            });
        }
        else if (newValue == 'remove') {
            VanillaToasts.create({
                title: 'Removed from Favorites',
                text: activeAmiiboName + ' has been removed from your Collection.',
                timeout: 4000,
                type: 'error',
            });
        }
        $.ajax({
            url: '/collection',
            type: 'post',
            data: {
                mine: newValue + "Amiibo",
                amiiboID: activeAmiiboID
            },
            success: function () {
                console.log("Request completed successfully");
            }
        });
    });

Любая помощь будет принята с благодарностью.Есть ли ...

A) Способ заставить javascript знать, что это значение проверяется на основе моего условного выражения в скорости, или B) Другой разумный способ, чтобы Javascript знал, что это значение проверено

Спасибо!Трэвис В.

1 Ответ

0 голосов
/ 19 сентября 2018

Я думаю, что понял это.Я запускаю новую переменную addRemove через оператор if, прежде чем JS решит добавить или удалить.Все еще открыты для других идей!Всегда открыт для обучения.Ниже приведено решение, которое я протестировал, и оно работает:

$(document).ready(function(){
    $( ".mine" ).change(function() {

        var amiibo = $(this).attr('id');
        var activeAmiiboID = amiibo.split('#')[1];
        var activeAmiiboName = amiibo.split('#')[2]
        var addRemove = document.getElementById("mine#"+activeAmiiboID+"#"+activeAmiiboName).value;

        if (addRemove == 'Y') {
            console.log("If: Value was "+ addRemove);
            var newValue = $(this).is(':checked') ? "remove" : "add";

        } else {
            console.log("Else: Value was "+ addRemove);
            var newValue = $(this).is(':checked') ? "add" : "remove";
        }

        $("#star"+activeAmiiboID).toggleClass("has-text-warning");
        console.log( "Handler for .change() called with value: " + newValue );
        console.log("activeAmiiboID is: "+ activeAmiiboID);
        console.log("Sending request to backend");
        if (newValue == 'add') {
            VanillaToasts.create({
                title: 'Added to Favorites',
                text: activeAmiiboName + ' has been added to your Collection.',
                timeout: 4000,
                type: 'success',
            });
        }
        else if (newValue == 'remove') {
            VanillaToasts.create({
                title: 'Removed from Favorites',
                text: activeAmiiboName + ' has been removed from your Collection.',
                timeout: 4000,
                type: 'error',
            });
        }
        $.ajax({
            url: '/collection',
            type: 'post',
            data: {
                mine: newValue + "Amiibo",
                amiiboID: activeAmiiboID
            },
            success: function () {
                console.log("Request completed successfully");
            }
        });
    });
...