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 that you have read and understand our privacy policy and code of conduct.

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