2

Дорогие друзья, помогите, кто шарит в JS. Очень буду признателен, кто поможет сделать простой скриптец для сортировки таблиц. Допустим, у меня есть таблица

<table>
   <tr>
      <TD>1</TD>
      <TD>2</TD>
   </tr>
   <tr>
      <TD>3</TD>
      <TD>3</TD>
   </tr>
<table>

Желательно, не используя библиотеку jQuery, сделать сортировку методом перетаскивания, после которого сразу же отправляется ajax запрос для сохранения в базе текушего положения.

3 ответа 3

7

А ajax тебе тоже без jQuery сделать? В чем причина отказа от jQuery? Не нужно изобретать велосипедов, используй готовый плагин jquery sortable

Страница

<script>
    $(function() {
        $("#sortable").sortable(
        {
            cursor: 'move',
            update: function() {
                $.ajax({
                    url: '<?=$site_link;?>/sort_save/', // ссылка на обработчик
                    type: "POST",
                    data: { order: $('#sortable').sortable("toArray")
                    },
                    success: function (data) {
                        // обработка если надо
                    },
                    error: function () {
                        // обработка если надо
                });
            }
        });
        $("#sortable").disableSelection();
    });
</script>
<ul id="sortable"> 
<!-- Массив для сортировки с id записи и именем -->
<?if($array):foreach($array as $item):?>
     <li id="sort-<?=$item['id'];?>"><?=$item['name'];?></li>
<?endforeach; endif;?>
</ul>

Обработчик на сервере

function sort_save(){
    $error = false;
    $order = $_POST['order'];
    foreach($order as $i=>$id){
        $post['sort'] = $i;
        $id = str_replace("sort-", "", $id);
        $result = base::sql_edit("my_table", $post, "where id_sitemap = '$id'"); // update в базе
        if(!$result) $error = true;
    }
    if($error){
        // обработка ошибки
    }
}
2
  • дело в том что в js я не очень силён, jquery это очень тяжеловесная библиотека, но я буду не против и если вы мне представите решение на jquery тем более там нужно формировать запрос при каждом перетаскивании, а я не знаю чесно говоря как это сделать
    – Runet29
    19 авг 2011 в 3:32
  • Добавил в сообщение полностью готовый код, который сам использую. 19 авг 2011 в 6:00
1
<ul id="sortbl">

  <li id="1">1</li>
  <li id="2">2</li>
  ......
  <li id="N">N</li>
</ul>
$("sortbl").sortable({
   update: function(event, ui){
     var position = ui.item.prevAll().length + 1;
     $.post(ACTION_URL,{id: ui.item.attr("id"), position: position}, function(data){
          alert(data);
     });
   }
});

ACTION_URL - скрипт, который делает апдейт в БД, записывает новую position для элемента id.

0

Можно, я на эту тему тоже задам вопрос ?(Не хочу креатит новую тему). Точно такая же ,но другая уже проблема. Отправка запроса ajax-ом, перетаскивание,и .т д это все не проблема. Насчет ui нет проблем. Проблема в том, что таблица, которая хранят эти данные, каждые 5 минут по cron-у очищается полностью (truncate table, база mysql),и вставляются новые записи. Записи могут та и повторять старых, или же могут вообще, новые появится, которые не были до стирания предыдущих записей. А менеджерам надо, чтобы как то распределить время запросов клиентов, перетаскивая. Думал, может как то создать некую таблицу, и в нее писать ИД-шники, и по нему сортировать.Но пока все еще туманно..Что посоветутете?? Буду рад только. :)

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.