Как решить, принимать или отклонять jQuery, перетаскиваемый в буксируемый - PullRequest
Новая
       23

Как решить, принимать или отклонять jQuery, перетаскиваемый в буксируемый

5 голосов
/ 07 апреля 2011

Я использую jQuery, и у меня возникает следующая проблема:

На моем сайте у меня есть шахматная доска с фигурами.Каждый квадрат - это простой div со свойством background, чтобы показать белый или черный.Над этими квадратами (внутри div) я поместил тег img, ссылающийся на кусок, который должен быть над этим квадратом.Что-то вроде: 

<div id="a8" class="square" style="background-image: url('/images/background_white.png')">
<img id="piece_a8" class="piece" src="/images/rook_black.png" />
</div>

Я могу контролировать движение фигур с помощью jQuery.Каждый piece -класс класса является перетаскиваемым, а каждый square -класс класса - опускаемым.У меня уже есть серверная функция, которая при заданном наборе координат возвращает "VALID" , если движение допустимо, и "INVALID" , если не указано иное.Моя идея заключается в том, что если сервер возвращает «INVALID», то часть должна вернуться к исходному квадрату, а если сервер возвращает «VALID», то часть должна остаться в своем новом квадрате, удалив все остальные части внутри целевого квадрата.

Моя проблема в том, что я не знаю, как мне применить это возвращаемое значение в моем коде jQuery.Я пытался поместить функции в свойство revert перетаскиваемого объекта и в функции accept и drop объекта перетаскивания, но я не нашел, как заставить $.get возвращать значение false или true.

Любая помощь будет очень признательна.

Заранее спасибо,

Léster

1 Ответ

5 голосов
/ 07 апреля 2011

Неважно, ответил.

В случае, если кому-то нужно знать, трюк состоит из 2 частей:

Первый: В перетаскиваемом определении, под событием запускаДобавьте функцию, которая сохраняет исходную позицию.Например: 

$('item_to_drag').draggable({
    start: function(){
        $(this).data("origPosition",$(this).position());
    }
});

Секунда: В определении сбрасывания под событием drop введите .get и используйте функцию для обработки ответа;если ваши условия не выполнены, анимируйте перетаскиваемый объект обратно в исходное положение.Например: 

drop: function (event, ui) {
        $.get(url,function(data) {
            if (data == '"INVALIDO"')
            {
                ui.draggable.animate(ui.draggable.data("origPosition"),"slow");
            }
            else
            {
                //store new positions, whatever;
            }
        }
    );
}

Это поможет.

Часть ответа пришла отсюда: Как в jQuery отменить перетаскивание при сбое вызова ajax? .

...