2010-05-03 1 views
0

Это мой JqueryJquery Session & Таблица Фильтрация

 <script type="text/javascript"> 
$(function() { 
var from = $.session("from"); 
var to = $.session("to"); 

var $th = $('#theTable').find('th'); 
// had to add the classes here to not grab the "td" inside those tables 
var $td = $('#theTable').find('td.bluedata,td.yellowdata'); 

$th.hide(); 
$td.hide(); 

if (to == "Select" || from == "Select") { 
    // shortcut - nothing set, show everything 
    $th.add($td).show(); 
    return; 
} 

var filterArray = new Array(); 
filterArray[0] = to; 
filterArray[1] = from; 

    $.each(filterArray, function(i){ 
    if (filterArray[i].toString() == "Select") 
    { 
     filterArray[i] = ""; 
    } 
}); 
$($th).each(function(){ 
    if ($(this,":eq(0):contains('" + filterArray[0].toString() + "')") != null 
     && $(this,":eq(1):contains('" + filterArray[1].toString() + "')") != null) 
    { 
     $(this).show(); 
    } 
}); 
$($td).each(function(){ 
    if ($(this,":eq(0):contains('" + filterArray[0].toString() + "')") != null 
     && $(this,":eq(1):contains('" + filterArray[1].toString() + "')") != null) 
    { 
     $(this).show(); 
    } 
}); 
    }); 
    </script> 

Это мой стол

<table border="1" id="theTable"> 
    <tr class="headers"> 
     <th class="bluedata"height="20px" valign="top">63rd St. &amp; Malvern Av. Loop<BR/></th> 
     <th class="yellowdata"height="20px" valign="top">52nd St. &amp; Lansdowne Av.<BR/></th> 
     <th class="bluedata"height="20px" valign="top">Lancaster &amp; Girard Avs<BR/></th> 
     <th class="yellowdata"height="20px" valign="top">40th St. &amp; Lancaster Av.<BR/></th> 
     <th class="bluedata"height="20px" valign="top">36th &amp; Market Sts<BR/></th> 
      <th class="bluedata"height="20px" valign="top">6th &amp; Market Sts<BR/></th> 
     <th class="yellowdata"height="20px" valign="top">Juniper Station<BR/></th> 
    </tr> 
    <tr> 
     <td class="bluedata"height="20px" title="63rd St. &amp; Malvern Av. Loop"> 
     <table width="100%"><tr><td>12:17am</td></tr><tr><td>12:17am</td></tr><tr><td>12:47am</td></tr></table> 
     </td> 
     <td class="yellowdata"height="20px" title="52nd St. &amp; Lansdowne Av."> 
     <table width="100%"><tr><td>12:17am</td></tr><tr><td>12:17am</td></tr><tr><td>12:47am</td></tr></table> 
     </td> 
     <td class="bluedata"height="20px" title="Lancaster &amp; Girard Avs"> 
     <table width="100%"><tr><td>12:17am</td></tr><tr><td>12:17am</td></tr><tr><td>12:47am</td></tr></table> 
     </td> 
     <td class="yellowdata"height="20px" title="40th St. &amp; Lancaster Av."> 
     <table width="100%"><tr><td>12:17am</td></tr><tr><td>12:17am</td></tr><tr><td>12:47am</td></tr></table> 
     </td> 
     <td class="bluedata"height="20px" title="36th &amp; Market Sts"> 
     <table width="100%"><tr><td>12:17am</td></tr><tr><td>12:17am</td></tr><tr><td>12:47am</td></tr></table> 
     </td> 
      <td class="bluedata"height="20px" title="6th &amp; Market Sts"> 
     <table width="100%"><tr><td>12:17am</td></tr><tr><td>12:17am</td></tr><tr><td>12:47am</td></tr></table> 
     </td> 
     <td class="bluedata"height="20px" title="Juniper Station"> 
     <table width="100%"><tr><td>12:17am</td></tr><tr><td>12:17am</td></tr><tr><td>12:47am</td></tr></table> 
     </td> 
    </tr> 
</table> 

Я задавал вопросы о здесь раньше, и я имел успех в преобразовании значения TextBox в выпадающее изменение. Однако это немного другое. Я использую плагин сессий (который отлично работает). На одной странице у меня есть набор нормальных выпадающих списков, при отправке вы попадаете на отдельную страницу, на которой выполняется функция выше, однако все строки/столбцы отображаются, и они вообще не фильтруются.

Редактировать: После просмотра кода, я думаю, это потому, что если элемент существует (! = Null), он просто отображает все TH или TR вместо выбранного.

ответ

0

Я понял, для тех, кто интересуется.

 <script type="text/javascript"> 
$(function() { 
var from = $.session("from"); 
var to = $.session("to"); 
var $th = $('#theTable').find('th'); 
var $td = $('#theTable').find('td.bluedata,td.yellowdata'); 

if (to == "Select" || from == "Select") { 
    // shortcut - nothing set, show everything 
    $th.add($td).show(); 
    return; 
} 

$th.add($td).hide(); 
$th.each(function(idx) { 
     var notSelected = $(this).text(); 
     if ((notSelected.indexOf(to) != -1) || (notSelected.indexOf(from) != -1)) { 
     // the text had the to or the from in it - so show this tr 
     $(this).show(); 
     // and show its corresponding td 
     $td.eq(idx).show(); 
     } 
    });      
}); 
</script> 
Смежные вопросы