PHP.SU

Программирование на PHP, MySQL и другие веб-технологии

PHP.SU Портал

Главная

Помощь

Поиск

Поиск Яндекс Вакансии

Пользователи

Здравствуйте, Гость

( Вход · Регистрация · Правила форума )

Забыли пароль?

сортировка таблицы через jquery

Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript (Модератор: armancho7777777)

Страниц (1): [1]

Без описания

Поиск в теме | Версия для печати

daglas1	Отправлено: 04 Апреля, 2013 - 13:17:57
Посетитель Покинул форум Сообщений всего: 329 Дата рег-ции: Июль 2011 Помог: 1 раз(а)	Всем привет. Есть таблица которую строю динамически на основе пхп скрипта. А потом есть необходимость ее сортировать. Сортировка сейчас запускается, вызывает этот скрипт с нужными параметрами, скрипт выдает ответ в аякс формате, но таблица не пересортировуется а так и висит надпись processing Шапка таблицы выглядит таким образом CODE (javascript): скопировать код в буфер обмена $('#mainTable').dataTable( { //"bJQueryUI": true, "sScrollY": 450, "sScrollX": "95%", //"sScrollXInner": "100%", "bPaginate": true, "bLengthChange": false, "bFilter": false, "bSort": true, "bInfo": false, "bAutoWidth": true, "bProcessing": true, "bServerSide": true, "sAjaxSource": "calc2_data.php<?=$data?>", "aoColumnDefs": [ { "bSortable": true, "aTargets": [ 0 ] } ], "aaSorting": [[ 1, 'asc' ]],

DelphinPRO	Отправлено: 04 Апреля, 2013 - 13:56:08
Активный участник Покинул форум Сообщений всего: 7187 Дата рег-ции: Февр. 2012 Помог: 353 раз(а)	http://datatables[dot]net/ ----- Чем больше узнаю, тем больше я не знаю.

daglas1	Отправлено: 04 Апреля, 2013 - 14:34:44
Посетитель Покинул форум Сообщений всего: 329 Дата рег-ции: Июль 2011 Помог: 1 раз(а)	[quote=DelphinPRO][/quote] пасибо. Скорее всего дело тут описанно http://datatables[dot]net/usage/columns http://stackoverflow[dot]com/questio[dot][dot][dot]sort-not-working ибо колонок у меня много и они содержат значения разных типов. А есть еще строки с объединением колонок. Это влияет на сортировку (colspan)? (Добавление) Взял шапку из этой страницы http://live[dot]datatables[dot]net/#javascript,html,live но все равно не работает. Может причина в получении данных динамически? Если бы была статическая страница то может быть бы все работало, а то у меня клики по заголовку таблицы заново создают аякс запрос.

IllusionMH	Отправлено: 04 Апреля, 2013 - 15:54:57
Активный участник Покинул форум Сообщений всего: 4254 Дата рег-ции: Февр. 2011 Откуда: .kh.ua Помог: 242 раз(а)	daglas1, там случаем событие клика не всплывает до обработчика с запросом? как я понимаю CODE (javascript): скопировать код в буфер обмена $('#example').dataTable(); нужно ставить в колбэк запроса. Если не так понял - пример на jsfiddle или любом другом месте выложите.

daglas1	Отправлено: 04 Апреля, 2013 - 16:01:16
Посетитель Покинул форум Сообщений всего: 329 Дата рег-ции: Июль 2011 Помог: 1 раз(а)	IllusionMH пишет: daglas1, там случаем событие клика не всплывает до обработчика с запросом? как я понимаю CODE (javascript): скопировать код в буфер обмена $('#example').dataTable(); нужно ставить в колбэк запроса. Если не так понял - пример на jsfiddle или любом другом месте выложите. Там идет сначало шапка, потом "fnRowCallback": function( nRow, aData, iDisplayIndex ) после этой функции объявлена $.getJSON('calc2_idata.php<?= $data ?>', function(data) Пример попробую выложить

IllusionMH	Отправлено: 04 Апреля, 2013 - 16:07:21
Активный участник Покинул форум Сообщений всего: 4254 Дата рег-ции: Февр. 2011 Откуда: .kh.ua Помог: 242 раз(а)	daglas1, это точно есть на странице http://live[dot]datatables[dot]net/#javascript,html,live ? (Добавление) на этой тоже нету http://datatables[dot]net/examples/d[dot][dot][dot]ources/ajax[dot]html

daglas1	Отправлено: 04 Апреля, 2013 - 16:36:50
Посетитель Покинул форум Сообщений всего: 329 Дата рег-ции: Июль 2011 Помог: 1 раз(а)	IllusionMH пишет: daglas1, это точно есть на странице http://live[dot]datatables[dot]net/#javascript,html,live ? (Добавление) на этой тоже нету http://datatables.net/examples/data_sources/ajax.html вот полный ява скрипт код с мизерными примесями пхп CODE (javascript): скопировать код в буфер обмена <script type="text/javascript"> $(document).ready(function() { $('#mainTable').dataTable( { //"bJQueryUI": true, "sScrollY": 450, "sScrollX": "95%", //"sScrollXInner": "100%", "bPaginate": false, "bLengthChange": false, "bFilter": false, "bSort": true, "bInfo": false, "bAutoWidth": true, "bProcessing": false, "bServerSide": true, "sAjaxSource": "calc2_data.php<?=$data?>", "aoColumnDefs": [ { "asSorting": [ "asc" ], "aTargets": [ 1 ] }, { "asSorting": [ "desc", "asc", "asc" ], "aTargets": [ 2 ] }, { "asSorting": [ "desc" ], "aTargets": [ 3 ] }, { "asSorting": [ "asc" ], "aTargets": [ 4 ] }, { "asSorting": [ "desc", "asc", "asc" ], "aTargets": [ 5 ] }, { "asSorting": [ "desc" ], "aTargets": [ 6 ] } ], "iDefaultSortIndex": 2, "sDefaultSortDirection": "asc" , "fnRowCallback": function( nRow, aData, iDisplayIndex ) { if ( aData[0] == "G" ) { var nGroup = document.createElement( 'tr' ); var nCell = document.createElement( 'td' ); nCell.className = "group1 left"; nCell.innerHTML = aData[1]; nCell.colSpan = 8; nGroup.appendChild( nCell ); nRow = nGroup; } else if ( aData[0] == "A") { var nGroup = document.createElement( 'tr' ); var nCell = document.createElement( 'td' ); nCell.className = "avg1 right"; nCell.innerHTML = aData[1]; nGroup.appendChild( nCell ); var span = 2; for( var j=2; j<aData.length; j++ ) { if( aData[j] == "" ) { span++; } else { var nCell2 = document.createElement( 'td' ); nCell2.className = "avg1"; nCell2.innerHTML = aData[j]; nGroup.appendChild( nCell2 ); } } nCell.colSpan = span; nRow = nGroup; //$('td:eq(4)', nRow).html( '<b>A</b>' ); } for(var i=4; i<=5; i++) { if(aData[i] > 0) { $('td:eq(' + i + ')', nRow).addClass( 'green' ); } else if(aData[i] < 0) { $('td:eq(' + i + ')', nRow).addClass( 'red' ); } } return nRow; }, } ); $.datepicker.setDefaults( $.datepicker.regional[ "ru" ] ); $( "#dt1,#dt2" ).datepicker($.datepicker.regional[ "ru" ]); $.getJSON('calc2_idata.php<?= $data ?>', function(data) { var items = []; prevGrp = -1; $.each(data, function(key, val) { if(prevGrp!=val[3]) { prevGrp=val[3]; items.push('<dt id="' + key + '"><input type="checkbox" name="grp_' + val[3] + '"/>' + val[4] + '</dt>'); } items.push('<dd id="' + key + '"><input type="checkbox" name="code_' + val[2] + '" ' + (val[5] ? 'checked' : '') + '/>' + val[0] + '</dd>'); }); $('<dl/>', { 'class': 'my-new-list', html: items.join('') }).appendTo('div#setuplist'); $("dt > :checkbox").click(function() { var cbs = $(this).parent().nextUntil("dt").children(":checkbox"); if($(this).attr('checked')) { cbs.attr('checked', 'checked'); } else { cbs.removeAttr('checked'); } }); }); $("a.setup").fancybox( { "width": 800, "height": 300, "overlayShow": false, }); } ); </script> (Добавление) Трабла была в "bServerSide": false, именно фолс должен быть в качестве параметра чтобы сортировалось все в браузере на стороне клиента.

daglas1	Отправлено: 12 Апреля, 2013 - 18:13:57
Посетитель Покинул форум Сообщений всего: 329 Дата рег-ции: Июль 2011 Помог: 1 раз(а)	появился еще вопрос. Как исключить некоторые поля из сортировки? А то получается морока, при сортировки полей которые внутри colspan получаются траблы. Также иногда имеют место траблы если в таблице есть разделители строк, т.е. идут строки с данными , потом очередной колспан на всю ширину таблицы с названием нового вида данных и опять данные, и так много раз внутри таблицы. Так вот когда пересортировываю отдельные поля, вот эти вот разделители иногда оказываются все в верху ибо в них пусто ( сортировка по возрастанию).

Поиск в теме | Версия для печати

Страниц (1): [1]

Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)

« JavaScript & VBScript »

Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.