Показать сообщение отдельно
  #1 (permalink)  
Старый 09.06.2012, 09:11
Новичок на форуме
Отправить личное сообщение для sigvart Посмотреть профиль Найти все сообщения от sigvart
 
Регистрация: 09.06.2012
Сообщений: 4

Фильтр таблицы с rowspan
Добрый день!
Есть таблица, в которой ячейки в определенных столбцах объединены. Нужно реализовать фильтр для столбцов. Не могу реализовать корректное скрытие строк, которые не удовлетворяют условиям поиска. Т.е. если в столбец с объединенными ячейками ввести значение, то часть таблицы сдвигается. Пробовал PicNet Table Filter, но там такая же бага.
<table width="700" cellspacing="0" border="1" id="MainContent_SRGV" >
  <tr>
	<th>ID</th>
	<th>Сущность</th>
	<th>Элемент</th>
	<th>Дата</th>
  </tr>
  <tr>
	<td><input type="text" name="" onchange="change(this,0,'SRGV',1)"></td>
	<td><input type="text" name="" onchange="change(this,1,'SRGV',1)"></td>
	<td><input type="text" name="" onchange="change(this,2,'SRGV',0)"></td>
	<td><input type="text" name="" onchange="change(this,3,'SRGV',1)"></td>
  </tr>
  <tr>
	<td rowspan="3" id="r2c0">1</td>
	<td rowspan="3" id="r2c1">Сущность 1</td>
	<td id="r2c2">Элемент 1.1</td>
	<td rowspan="3" id="r2c3">01.6.2012</td>
  </tr>
  <tr>
	<td id="r3c2">Элемент 1.2</td>
  </tr>
  <tr>
	<td id="r4c2">Элемент 1.3</td>
  </tr>
    <tr>
	<td rowspan="3" id="r5c0">2</td>
	<td rowspan="3" id="r5c1">Сущность 2</td>
	<td id="r5c2">Элемент 2.1</td>
	<td rowspan="3" id="r5c3">10.8.2012</td>
  </tr>
  <tr>
	<td id="r6c2">Элемент 2.2</td>
  </tr>
  <tr>
	<td id="r7c3">Элемент 2.3</td>
  </tr>

  </table>


Код яваскрипт (вместо скрытия строки стоит закраска ее цветом):
function change(textControl, i, tablename, rws) 
	{
		var TableForFilter = document.getElementById('MainContent_' + tablename);
		searchtext=textControl.value;
		searchtext=searchtext.toLowerCase()
		i_tmp=1;
		if (rws==1)
		{	
		//для колонки с rowspan
			for (var r = 2; r < TableForFilter.rows.length; r++) 
			{			
				temp_id=TableForFilter.rows[r].cells[i].id;	
				rs=TableForFilter.rows[r].cells[i].rowSpan;
				
				
				cellvalue=TableForFilter.rows[r].cells[i].innerHTML;
				cellvalue=cellvalue.toLowerCase()
				//сравниваем
				if (searchtext.length>0)
				{				
					pos = cellvalue.indexOf(searchtext);
					if (pos != -1)
					{
						TableForFilter.rows[r].cells[i].style.background="#3399cc";
						//TableForFilter.rows[r].cells[i].style.display="none";
					}	
					else
					{
						TableForFilter.rows[r].cells[i].style.background="white";
						//TableForFilter.rows[r].cells[i].style.display="block";
					}
				}
				else
				{
					TableForFilter.rows[r].cells[i].style.background="none";
					//TableForFilter.rows[r].cells[i].style.display="block";
				}
				if (rs>1)
				{
					r=r+rs-1;					
				}
			}
		}
		else
		{
		//для колонки без объединенных ячеек
		i_tmp=i;
			for (var r = 2; r < TableForFilter.rows.length; r++) 
			{							
				if (TableForFilter.rows[r].cells[0].rowSpan>1)
				{
					i=i_tmp;
				}
				else
				{
					i=0;
				}
				temp_id=TableForFilter.rows[r].cells[i].id;	
				rs=TableForFilter.rows[r].cells[i].rowSpan;
				cellvalue=TableForFilter.rows[r].cells[i].innerHTML;
				cellvalue=cellvalue.toLowerCase()
				//сравниваем
				if (searchtext.length>0)
				{				
					pos = cellvalue.indexOf(searchtext);
					if (pos != -1)
					{
						TableForFilter.rows[r].cells[i].style.background="#3399cc";
						//TableForFilter.rows[r].cells[i].style.display="none";
					}
					else
					{
						TableForFilter.rows[r].cells[i].style.background="white";
						//TableForFilter.rows[r].cells[i].style.display="block";
					}
				}
				else
				{
					TableForFilter.rows[r].cells[i].style.background="none";					
					//TableForFilter.rows[r].cells[i].style.display="block";
				}
				if (rs>1)
				{
					r=r+rs-1;					
				}
			}
		}
	}

Поиск ничего не дал. Может быть и есть решение, но я его не нашел. Буду благодарен за любую помощь!
Ответить с цитированием