DownLoad_Free

Сортировка списка и таблицы с помощью javascript(js)

Главная » Материалы » Web, scripts

<--Немного места для рекламы-->
ТиЦ

Сортировка списка и таблицы с помощью javascript(js)

[ ] Дата обновления: 5.6.2017
Недавно столкнулся с проблемой динамической сортировки списка данных. Как обычно залез в поисковики и обнаружил лишь ссылки на описание сортировки таблиц. При этом процедура оказалась настолько заумной, что я от нее отказался. Покопавшись в интернете около часа наткнулся на функцию javascipt - sort() - она меня и выручила.

Вот что получилось
Sort_АЯ | Sort_ЯА

  • Сортировка
  • Случайных
  • Данных
  • javascript

  • Ну за одним и таблицы:

    Sort_1 | Sort_2 | Sort_3

    ВасяИванов12
    ПетяВасильев122
    НаташаГолубева31
    ИраТрунова2


    Теги материала: sort, список
    Похожие материалы:
    Категория: Все | Добавил: anikey99
    Просмотров: 5030 | Загрузок: 0
    Полезные дополнения: <--могут быть здесь-->

    Всего комментариев: 2
    2  
    Код сортировки списка:
    <a onclick=sorrtab()>Sort_АЯ</a> | <a onclick=sorrtz()>Sort_ЯА</a><br><br>
    <div id='ul11'>
    <li>Сортировка
    <li>Случайных
    <li>Данных
    <li>javascript
    </div>

    <script>
    var myar100 = new Array();
    var li1=document.getElementById('ul11').getElementsByTagName('li');
    document.getElementById('ul11').style.fontsize='14px';
    function sorrtab() {

    for(var li2=0;li2<li1.length;li2++) {
    myar100[li2]=li1[li2].innerHTML;
    }
    myar100.sort();
    for(var li3=0;li3<li1.length;li3++) {
    li1[li3].innerHTML=myar100[li3];

    }
    }

    function sorrtz() {

    //var li1=document.getElementsByTagName('li');
    for(var li2=0;li2<li1.length;li2++) {
    myar100[li2]=li1[li2].innerHTML;
    }
    myar100.sort();
    myar100.reverse();
    for(var li3=0;li3<li1.length;li3++) {
    li1[li3].innerHTML=myar100[li3];
    }
    }
    </script>


    1  
    код сортировки таблицы
    <a onclick=sorrta(0)>Sort_1</a> | <a onclick=sorrta(1)>Sort_2</a> | <a onclick=sorrta(2)>Sort_3</a>
    <table id=tab1 border=1>
    <tr><td width=100>Вася</td><td width=100>Иванов</td><td width=30>12</td></tr>
    <tr><td>Петя</td><td width=100>Васильев</td><td>122</td></tr>
    <tr><td>Наташа</td><td width=100>Голубева</td><td>31</td></tr>
    <tr><td>Ира</td><td width=100>Трунова</td><td>2</td></tr>
    </table>
    <div id=div1></div>

    <script>
    var myar= new Array();

    function sorrta(a1) {
    var li1=document.getElementById('tab1').getElementsByTagName('tr');
    var li2=li1[0].getElementsByTagName('td');
    var ctr=li1.length;
    var ctd=li2.length;
    for(var i=0;i<ctr;i++) {
    myar[i]="";
    for(var i2=0;i2<ctd;i2++) {
    myar[i]+=document.getElementById('tab1').getElementsByTagName('tr')[i].getElementsByTagName('td')[i2].innerHTML+"@@";
    }
    var zz=myar[i];
    var dth=decToHex(zz.split('@@')[a1]);
    if(dth!='NaN') {
    if(dth.length==1) {dth="00"+dth;}
    if(dth.length==2) {dth="0"+dth;}
    myar[i]=dth+"@@"+myar[i];
    } else {
    myar[i]=myar[i].split('@@')[a1]+"@@"+myar[i];
    }
    }
    myar.sort();
    for(var i=0;i<ctr;i++) {
    for(var i2=1;i2<(ctd+1);i2++) {
    document.getElementById('tab1').getElementsByTagName('tr')[i].getElementsByTagName('td')[i2-1].innerHTML=myar[i].split('@@')[i2];
    }
    }
    }

    function decToHex(n) { return Number(n).toString(36); }
    function hexTodec(hex) { return parseInt(hex,36); }

    </script>


    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]
    Нашли ошибку или
    Быстрая форма обратной связи -
    жмите Ctr+Enter Система Orphus
    Рекомендуем:
    <--что-нибуть здесь-->



    Случайные материалы


    Copyright kachay.ucoz.org © 2008-2017 | Хостинг от uCoz | wright2webmaster | Рейтинг@Mail.ru
     
    ^ Наверх ^
    Полезно!

    Код кнопки