Вешаю событие height на onresize
1.
2.
<script type="text/javascript">
window.onresize=height;
Выравниваю колонки заголовка (первые две строки) по телу (т.к. ширина колонок тела, по содержимому) у 1 колонки фиксированная ширина не трогаю
1.
2.
3.
4.
5.
6.
function sTable()
{ for(var j=0;j<9;j++){
if(j!=1){
document.all.table1.rows[0].cells[j].width=getComputedStyle(document.all.table1.rows[2].cells[j]).width;
document.all.table1.rows[1].cells[j].width=getComputedStyle(document.all.table1.rows[2].cells[j]).width;
}}}
Рассчитываю высоту таблицы и распорки в зависимости от размера экрана
1.
2.
3.
4.
5.
function height()
{var height=window.innerHeight-70;
document.getElementById('hey').style.height=height+'px'; [color=green]/*высота распорки больше на заголовок*/[/color]
document.getElementById('tab').style.height=height-15+'px';sTable(); [color=green]/*чтобы заголовок прокручивался*/[/color]
}
После применения фильтра, колонки тела меняют ширину (т.к. нет строк, которые влияли на ширину столбцов). Находим первую видимую строку и выравниваем ширину столбов тела
теперь уже по ширине столбов заголовка
1.
2.
3.
4.
5.
function ops()
{var table=document.getElementById('table1');
for(var i=2;i< table.rows.length;i++)
{if (table.rows.item(i).style.display!='none')
{for (j=0;j<8;j++) if(j==1){table.rows[i].cells[j].width="100px"}else{table.rows[i].cells[j].width=table.rows[0].cells[j].width};break;}}}
запускается при загрузке страницы
дальше идет скрипт по фильтру столбов взял с сайта, который я не смог понять. Фильтр по любому вхождению символа, без учета регистра.
http://php-zametki.ru/javascript-laboratoriya/130-javascript-filter-table.html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
var filterTable=function(b,c)
{
var d=b.getElementsByTagName("TR"),e={},a;
for(a in c)c.hasOwnProperty(a)&&(e[a]=c[a]instanceof filterTable.Filter?c[a]:new filterTable.Filter(c[a]),e[a]._setAction("onchange",
function(){var a,c,b;for(c=0;c<d.length;c+=1) for(b in a=d.item(c),e)if(e.hasOwnProperty(b)) if(!1===e[b].validate(a.children[b].innerText)) {a.style.display="none";break}else a.style.display=""
}))
};
filterTable.Filter=function(b,c,d)
{
if(!(this instanceof arguments.callee))return new arguments.callee(b,c,d);
this.filters="[object Array]"=={}.toString.call(b)?b:[b];
this.validate=function(c){for(var a=0;a<this.filters.length;a+=1)if(!1===this.__validate(c,this.filters[a],a))return!1};
this.__validate=function(b,a,f){if("undefined"!==typeof c)return c(b,this.filters,f);a.value=a.value.replace(/^\s+$/g,"");return!a.value||a.value==b};
this._setAction=function(c,a){for(var b=0;b<this.filters.length;b+=1)this.filters[b][d||c]=a};
};
а это настройка фильтров делаете, по колонкам где у вас фильтры input или select.
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
filterTable(
document.getElementById("target"), {
0: document.getElementById("marka"),
2: document.getElementById("grupa"),
3: new filterTable.Filter(document.getElementById("name"),function(value,filters,i){var c_value = value.toLowerCase(),f_value = filters[i].value.toLowerCase();return c_value.indexOf(f_value)!=-1;},"onkeyup"),
4: new filterTable.Filter(document.getElementById("sost"),function(value,filters,i){var c_value = value.toLowerCase(),f_value = filters[i].value.toLowerCase();return c_value.indexOf(f_value)!=-1;},"onkeyup"),
5: document.getElementById("inten"),
6: new filterTable.Filter(document.getElementById("pome"),function(value,filters,i){var c_value = value.toLowerCase(),f_value = filters[i].value.toLowerCase();return c_value.indexOf(f_value)!=-1;},"onkeyup"),
7: new filterTable.Filter(document.getElementById("opis"),function(value,filters,i){var c_value = value.toLowerCase(),f_value = filters[i].value.toLowerCase();return c_value.indexOf(f_value)!=-1;},"onkeyup"),
}
)
</script>
