Придется дважды щелкнуть, чтобы зафиксировать обновление JS-запроса в Firebase.

Question

Я создал веб-приложение, и для его правильной работы я должен использовать переключатели. Я создал переключатели, используя флажки и немного CSS. Я поместил значение в БД реального времени и хочу изменить его на 1 и 0 в зависимости от состояния коммутатора. Но моя проблема в том, что мне нужно дважды щелкнуть по переключателю, чтобы зафиксировать обновление значения в базе данных.

1. При первом щелчке переключатель становится зеленым (это означает, что его значение установлено в 1), но значение в дБ не изменяется
2. При втором щелчке переключатель не меняет цвети остается зеленым, значение в дБ теперь успешно обновляется до 1.
3. При третьем щелчке состояние переключателя отключается, но значение в дБ остается 1
4. При четвертом щелчке,цвет переключателя не меняется, и теперь значение в дБ успешно обновлено до 0

Javascript:

                    var database = firebase.database();

                    var ref1 = database.ref("switches/S1");
                    ref1.on("value", getData1);
                    function getData1(data) {
                        var checkbox = document.getElementById("switch");
                        checkbox.value = data.val();
                        ischecked=checkbox.checked;

                        if (checkbox.value == 1) {
                            checkbox.checked = true;
                            }
                        else if (checkbox.value == 0) {
                            checkbox.checked = false;
                            }
                    //this funciton is just to check the value of the field in the db
                        }
                    function toggle1(){ 
                        var ischecked = document.getElementById("switch").checked;

                        if(ischecked===true){
                            //set db value to 0 if clicked when switch is on
                            database.ref("switches").update({'S1': 0});
                        }

                        else{
                            //set db value to 1 if clicked when switch is off
                            database.ref("switches").update({'S1': 1});
                        }
                        } 

HTML:

<span><h2>FAN</h2></span>
<label class="switch">
<input type="checkbox" id="switch" onclick="toggle1()">
<span class="slider round"></span>

Я хочуэто быть отзывчивым и надежным. Спасибо.