nepster-web
@nepster-web

Как передвинуть элемент в jQuery после AJAX запроса?

Собственно есть такая ситуация:
Есть настройка, которая отображает кнопку слева или справа.
(К примеру есть 2 блока, в зависимости от настройки кнопка находится либо в 1 блоке либо во 2 блоке).

Когда пользователь обновляет страницу php рендерит представление и проблем нет. Но нужно сделать такую штуку, чтобы при нажатии на кнопку она меняла позицию. Тоесть: если мы нажимаем на кнопку и она изначально стояла слева, то она идет на права. Также и наоборот.

Html код (когда кнопка слева):
<div class="row">
        <div class="col-sm-6 col-md-6">
            <div class="lide-L"><div class="side-activations active" data-url="/binary/default/settings"></div></div>
        </div>
        
        <div class="col-sm-6 col-md-6">
            <div class="lide-R"></div>
    </div>


JS:
(function ($) {
    $('.side-activations.active').on('click', function(){
       
        console.log(   $(this).html()    ) // Пустая строка 
        
       var param = $('meta[name=csrf-param]').attr("content");
        var token = $('meta[name=csrf-token]').attr("content");
        
        var data = {};
            data[param] = token;
        $.ajax({
            url: $(this).data("url"),
            type: 'POST',
            data: data,
            success: function(response, textStatus, jqXHR) {
                if(response == 'L' || response == 'R'){
                    var side = response;
                    
                
                 
                    
                }
            }
        });
        return false;
    });
})(jQuery);


Когда мы посылаем запрос на сервер он возвращает либо L либо R и в зависимости от значение нужно разместить кнопку в правильный блок. У меня появилась мысль нахимичить с $(this).html() , но он оказался пустой, что меня удивило.

Еще один момент, класс .active обязательный (кликнуть можно только на активную кнопку).

Собственно подскажите пожалуйста как после AJAX запроса передвинуть кнопку из одного блока в другой ?
  • Вопрос задан
  • 2620 просмотров
Решения вопроса 2
Alexufo
@Alexufo
противоречивый, сложный, весь компьютерный.
api.jquery.com/toggleClass
Работать лучше через классы (прятать или показывать) с элементами чем менять DOM.

Если аякс ну сделайте проверку сами если проще, если класс left существует значит сделать то-то

$(this).html() и будет пустой. У вас же ничего нет внутри контейнера.
Попобуйте так $(this).parent().html()
Ответ написан
@Nevelon
Можно сделать 2 кнопки и скрывать/показывать их при нажатии
<div class="row">
        <div class="col-sm-6 col-md-6">
            <div class="lide-L"><div class="side-activations active" data-url="/binary/default/settings"></div></div>
        </div>
        
        <div class="col-sm-6 col-md-6">
            <div class="lide-R" style="display: none"><div class="side-activations active" data-url="/binary/default/settings"></div></div>
    </div>


$('.lide-L').toggle();
$('.lide-R').toggle();
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы