Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript]Dynamiczna filtracja a parametr w linku
Forum PHP.pl > Forum > Przedszkole
maciek257
Witam,

Na swojej stronie umieściłem skrypt dynamicznej filtracji tabeli:

  1. function Search() {
  2. var value = $('input[id$="txtSearch"]').val();
  3. if (value) {
  4. $('#MyTable tr:not(:first)').each(function () {
  5. var index = -1;
  6. $(this).children('td').each(function () {
  7. var text = $(this).text();
  8. if (text.toLowerCase().indexOf(value.toLowerCase()) != -1) {
  9. index = 0;
  10. return false;
  11. }
  12. });
  13. if (index == 0)
  14. $(this).show();
  15. else
  16. $(this).hide();
  17. });
  18. }
  19. else
  20. $('#MyTable tr').show();
  21. }
  22.  


  1. <input type="text" onkeyup="Search()" id="txtSearch" />


Niestety problem pojawia się kiedy chce, aby filtracja odbywała się po przekazaniu parametru w linku przechodząc z innej strony.

Przekazywany parametr pojawia się w polu input, ale skrypt po prostu czeka, aż sam zaznaczę to pole i wcisnę jakiś klawisz (choćby spację lub strzałkę) - wtedy filtruje bez zarzutów.

Czy jest jakaś opcja, aby filtracja jednak przebiegała automatycznie?

Będę bardzo widzięczny za pomoc bo już 3 dzień próbuję rozwiązać ten problem.
MadMark
Może onload="Search()" do inputa ?
Albo w jquery :
  1. $(document).ready(function(){
  2. if($("#search").val()!=""){
  3. Search();
  4. }
  5. });
maciek257
Dziękuję serdecznie!

onload nie pomóg, ale jquery uruchamia fitrację smile.gif

A czy ten skrypt można zastosować do bardziej skomplikowanej filtracji (z opcją sortowania i nadawania klasy .odd po filtracji)?

  1. $(document).ready(function() {
  2. zebraRows('tr:odd td', 'odd');
  3.  
  4. $('tbody tr').hover(function(){
  5. $(this).find('td').addClass('hovered');
  6. }, function(){
  7. $(this).find('td').removeClass('hovered');
  8. });
  9.  
  10. $('tbody tr').addClass('visible');
  11.  
  12. $('#search').show();
  13.  
  14. $('#filter').keyup(function(event) {
  15.  
  16. if (event.keyCode == 27 || $(this).val() == '') {
  17. $(this).val('');
  18.  
  19. $('tbody tr').removeClass('visible').show().addClass('visible');
  20. }
  21. else {
  22. filter('tbody tr', $(this).val());
  23. }
  24. $('.visible td').removeClass('odd');
  25. zebraRows('.visible:even td', 'odd');
  26. });
  27.  
  28. $('thead th').each(function(column) {
  29. $(this).addClass('sortable')
  30. .click(function(){
  31. var findSortKey = function($cell) {
  32. return $cell.find('.sort-key').text().toUpperCase() + ' ' + $cell.text().toUpperCase();
  33. };
  34.  
  35. var sortDirection = $(this).is('.sorted-asc') ? -1 : 1;
  36.  
  37. var $rows = $(this).parent()
  38. .parent()
  39. .parent()
  40. .find('tbody tr')
  41. .get();
  42. $.each($rows, function(index, row) {
  43. row.sortKey = findSortKey($(row).children('td').eq(column));
  44. });
  45.  
  46. $rows.sort(function(a, b) {
  47. if (a.sortKey < b.sortKey) return -sortDirection;
  48. if (a.sortKey > b.sortKey) return sortDirection;
  49. return 0;
  50. });
  51.  
  52. $.each($rows, function(index, row) {
  53. $('tbody').append(row);
  54. row.sortKey = null;
  55. });
  56.  
  57. $('th').removeClass('sorted-asc sorted-desc');
  58. var $sortHead = $('th').filter(':nth-child(' + (column + 1) + ')');
  59. sortDirection == 1 ? $sortHead.addClass('sorted-asc') : $sortHead.addClass('sorted-desc');
  60.  
  61. $('td').removeClass('sorted')
  62. .filter(':nth-child(' + (column + 1) + ')')
  63. .addClass('sorted');
  64.  
  65. $('.visible td').removeClass('odd');
  66. zebraRows('.visible:even td', 'odd');
  67. });
  68. });
  69. });
  70.  
  71. function zebraRows(selector, className)
  72. {
  73. $(selector).removeClass(className)
  74. .addClass(className);
  75. }
  76. function filter(selector, query) {
  77. query = $.trim(query);
  78. query = query.replace(/ /gi, '|');
  79.  
  80. $(selector).each(function() {
  81. ($(this).text().search(new RegExp(query, "i")) < 0) ? $(this).hide().removeClass('visible') : $(this).show().addClass('visible');
  82. });
  83. }


Jeśli tak, to w którym miejscu?
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.