133 Если вы фанат AJAX или вам нравится стиль удаления, как в WordPress, то эта статья для вас.
Вы нажимаете на ссылку удаления, элемент меню подсвечивается красным, а затем исчезает.
Далее представлен код, как это работает на Dojo JavaScript...
PHP – Заголовок & Контент
Данный сниппет помещаем наверх страницы:
|
1 2 3 4 |
if(isset($_GET['delete'])) { $query = 'DELETE FROM my_table WHERE item_id = '.(int)$_GET['delete']; $result = mysql_query($query,$link); } |
Следующий код используется для отображения записей:
|
1 |
$query = 'SELECT * FROM my_table ORDER BY title ASC';$result = mysql_query($query,$link);while($row = mysql_fetch_assoc($result)) { echo '<div id="record-',$row['item_id'],'"> <a href="?delete=',$row['item_id'],'">Delete</a> <strong>',$row['title'],'</strong> </div>';} |
Dojo JavaScript
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
dojo.addOnLoad(function() { dojo.query('a.delete').connect('onclick',function(e) { var a = this; dojo.anim(a.parentNode,{ backgroundColor: '#fb6c6c' },300); dojo.stopEvent(e); dojo.xhr('get',{ content: { ajax: 1 }, url: dojo.attr(a,'href'), load: function() { dojo.anim(a.parentNode,{ opacity: 0 },300,null,function() { dojo.query(a.parentNode).orphan(); }); } }); }); }); |
Для каждой ссылки, мы добавляем событие клика, которое будет вызывать AJAX запрос. Во время выполнения запроса, подсвечиваем фон элемента красным цветом. Когда AJAX запрос вернет успешное выполнение операции, мы скроем элемент с экрана.
Пример
А где вы планируете использовать данный сниппет?
