Идентификатор ячеек таблицы при dropdown
Генерируется таблица. Каждой ячейке присваивается id и свойство "ловящего элемента" (droppable).
Однако, при перетаскивании элемента в ячейку почему-то её адрес формируется не такой, как id ячейки: tbl = '<table width="100%" height="100%" border="1" cellpadding="0" cellspacing="0" id="dots">'; for(r=0; r<row; r++){ tbl+='<tr>'; for (c=0; c<col; c++){ tbl+='<td id="cell_'+(r*col+c)+'" onclick="alert(this.id)">'+(r*col+c)+'</td>'; }; tbl+='</tr>'; }; tbl+='</table>'; $('#Map').html(tbl); $('#dots td').droppable({ drop:function(event, ui){ alert(this.id);} }); }При клике на ячейке её адрес (ряд и строка) показывается верный. При "отпускании" (drop) элемента в ячейке отдаётся id на 2 больше. Как так получается? Ничо не понимаю! Кто сможет подсказать? Спасибо за помощь! |
А что такое там будет this если на входе event?
|
kostyanet,
да, верно. А как передать/определить id элемента, где произошло событие? |
Veterinar,
попробуйте event.target.id |
рони, спасибо, но... нет. Пусто.
А просто id отдает id через ячейку. Причем, если отпускать в ячейке 0:0 (в первой в таблице), то alert(event.target.id); возвращает cell_2 Как бы начинает считать с 2, соответственно получается, что количество ячеек в строке на 2 меньше. При этом на двух правых ячейках в каждой строке drop не срабатывает - этих ячеек как бы нету. :cray: |
Сначала надо открыть консоль и закрыть алерты. В консоли вы спокойно можете рассмотреть все свойства event'ов и this'ов - что там валится, откуда, в какой фазе и все такое. Второе - у вас же должен быть placeholder - а он будет там, где вы собираетесь бросить предмет. Иначе как вы увидите куда бросать. Placeholder как таковой уже все должен показать. То есть вы подносите к ячейке 1, а рамка проявляется на ячейке 2, или наоборот. Надо просто алертами не пользоваться. Особенно когда драги и дропы, и всякие там фокусы-блюры.
|
Ё-моё! )))))
В браузере FF начинает считать с 2, а в Chrome с 1... В ИЕ уже боюсь смотреть )))) |
Там будет 3, для полного счастья. Может документацию почитать, http://jqueryui.com/droppable/#shopping-cart - там вот есть плейсхолдер.
|
kostyanet, в каком месте вы нашли свой placeholder?
placeholder это вообще-то атрибут поля input, показывающий подсказку. |
placeholder это вообще-то местодержатель дословно.
А вот это щито? drop: function( event, ui ) { $( this ).find( ".placeholder" ).remove(); $( "<li></li>" ).text( ui.draggable.text() ).appendTo( this ); } При драгабле клиент должен видеть куда бросает - это ему и показывает местодержатель - в хтмле например див которому по событию драговер добавляется класс подсветки. Короче, читайте доку. ЗЫ подсказку показывает атрибут title, а вы узко мыслите. В элементе input - placeholder точно такой же местодержатель определенного типа данных. То есть шаблон на который можно ориентироваться. А если вы туда пишите ВАШ ИМЕЙЛ - это ваши проблемы. |
Часовой пояс GMT +3, время: 17:15. |