Получение нулевого значения при переключении форм (выбор через DOM) в AJAX успешной функции - PullRequest
Новая
       55

Получение нулевого значения при переключении форм (выбор через DOM) в AJAX успешной функции

0 голосов
/ 21 июня 2020

У меня есть простая кнопка «Нравится» и «Не похоже», которая будет переключаться при нажатии кнопки «Нравится» и «Не похоже» в обоих случаях (отправка AJAX вызовов при нажатии каждой кнопки)

Мой индекс. html 

<%if(video.LikedUsers.some(user=>{return(user.Username===currentUser.Username)})){%>
    <!--Unlike Form-->
            <form id="UnlikeButtonForm" action="/video/<%=video._id%>/unlike?_method=PUT" method="POST"
                style="display: inline;">
                <button id="UnlikeButton">Unlike</button>
            </form>
            <%}else{%>
            <!--Like Form-->
            <form id="LikeButtonForm" action="/video/<%=video._id%>/like?_method=PUT" method="POST"
                style="display: inline;">
                <button id="LikeButton">Like</button>
            </form>
            <%}%>

Мой сценарий, содержащий AJAX Вызовы 

<script>
        var LikeForm = document.querySelector("#LikeButtonForm");
        var UnlikeForm = document.querySelector("#UnlikeButtonForm");
        $("#LikeButtonForm").submit((event) => {
            event.preventDefault();
            $.ajax({
                type: "POST",
                url: LikeForm.action,
                success: function () {
                    //console.log(document.getElementById("UnlikeButtonForm")); Shows null
                    LikeForm.style.display="none"; //Like Button is succesfully hidden
                    //UnlikeForm.style.display="inline"; //Throws error
                }
            });
        });
        //Similar script for unlike button 
    </script>

Как я могу исправить эту проблему и переключить формы? Обратите внимание, серверная часть работает нормально .

...