Ir ao conteúdo
  • Cadastre-se
Fábio Henrque Ferreira

Manter filtro após refresh

Recommended Posts

Boa noite amigos,

 

Estou com uma dívida e como sou novato, infelizmente após várias pesquisas não consegui uma solução:

 

Tenho uma página da web que contém alguns filtros de colunas (código html a seguir). O que gostaria parece simples mas não me veio nenhuma solução até o momento: Preciso manter esses filtros após o refresh da página. Vale observar que, ao fazer esse refresh, o código roda um programa, que faz uma consulta e retorna todos os dados novamente, ou seja, seria necessário guardar os valores do filtro atual em uma variável e recuperá-los novamente através de algum javascript ou variável, que posso inserir no meu programa também (ou algo assim).

Resumindo: Ao clicar em refresh, eu rodo um programa que traz os dados que preciso, atualizando a página. Quero que ele traga os dados mas mantenha os filtros que estão vigentes.

No código abaixo, não chamei o programa, apenas dei um refresh na página, como exemplo do que preciso e do que está acontecendo já serve. Ao colocar um filtro e clicar em refresh, ele não mantém o filtro, mostrando todos os dados novamente:

 

*****************************************************************************************************************************************************************************

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://w
ww.w3.org/TR/html4/loose.dtd">
<html>
      <head>
              <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
              <title>Conteudo</title>
 
<script type="text/javascript">
window.onload=function(){
//para applid
var filtro = document.getElementById('filtro-applid');
var tabela = document.getElementById('lista');
filtro.onkeyup = function() {
    var nomeFiltro = filtro.value.toUpperCase();
    for (var i = 1; i < tabela.rows.length; i++) {
        if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1)
        {
                var conteudoCelula = tabela.rows.cells[0].textContent;
        }
        else
        {
                var conteudoCelula = tabela.rows.cells[0].innerText;
        }
        var corresponde = conteudoCelula.toUpperCase().indexOf(nomeFiltro) >= 0;
        tabela.rows.style.display = corresponde ? '' : 'none';
    }
};
//para cec
var filtro1 = document.getElementById('filtro-cec');
var tabela1 = document.getElementById('lista');
filtro1.onkeyup = function() {
    var nomeFiltro1 = filtro1.value.toUpperCase();
    for (var i = 1; i < tabela1.rows.length; i++) {
        if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1)
        {
                var conteudoCelula = tabela.rows.cells[1].textContent;
        }
        else
        {
                var conteudoCelula = tabela.rows.cells[1].innerText;
        }
        var corresponde = conteudoCelula.toUpperCase().indexOf(nomeFiltro1) >= 0;
        tabela1.rows.style.display = corresponde ? '' : 'none';
    }
};
//para smfid
var filtro2 = document.getElementById('filtro-smfid');
var tabela2 = document.getElementById('lista');
filtro2.onkeyup = function() {
    var nomeFiltro = filtro2.value.toUpperCase();
    for (var i = 1; i < tabela2.rows.length; i++) {
        if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1)
        {
                var conteudoCelula = tabela.rows.cells[2].textContent;
        }
        else
        {
                var conteudoCelula = tabela.rows.cells[2].innerText;
        }
        var corresponde = conteudoCelula.toUpperCase().indexOf(nomeFiltro) >= 0;
        tabela2.rows.style.display = corresponde ? '' : 'none';
    }
};
//para procstep
var filtro3 = document.getElementById('filtro-procstep');
var tabela3 = document.getElementById('lista');
filtro3.onkeyup = function() {
    var nomeFiltro = filtro3.value.toUpperCase();
    for (var i = 1; i < tabela3.rows.length; i++) {
        if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1)
        {
                var conteudoCelula = tabela.rows.cells[3].textContent;
        }
        else
        {
                var conteudoCelula = tabela.rows.cells[3].innerText;
        }
        var corresponde = conteudoCelula.toUpperCase().indexOf(nomeFiltro) >= 0;
        tabela3.rows.style.display = corresponde ? '' : 'none';
    }
};
//para status
var filtro4 = document.getElementById('filtro-status');
var tabela4 = document.getElementById('lista');
filtro4.onkeyup = function() {
    var nomeFiltro = filtro4.value.toUpperCase();
    for (var i = 1; i < tabela4.rows.length; i++) {
        if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1)
        {
                var conteudoCelula = tabela.rows.cells[4].textContent;
        }
        else
        {
                var conteudoCelula = tabela.rows.cells[4].innerText;
        }
        var corresponde = conteudoCelula.toUpperCase().indexOf(nomeFiltro) >= 0;
        tabela4.rows.style.display = corresponde ? '' : 'none';
    }
};
//para descrição
var filtro5 = document.getElementById('filtro-descricao');
var tabela5 = document.getElementById('lista');
filtro5.onkeyup = function() {
    var nomeFiltro = filtro5.value.toUpperCase();
    for (var i = 1; i < tabela5.rows.length; i++) {
        if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1)
        {
                var conteudoCelula = tabela.rows.cells[5].textContent;
        }
        else
        {
                var conteudoCelula = tabela.rows.cells[5].innerText;
        }
        var corresponde = conteudoCelula.toUpperCase().indexOf(nomeFiltro) >= 0;
        tabela5.rows.style.display = corresponde ? '' : 'none';
    }
};

//para stcstate
var filtro7 = document.getElementById('filtro-stcstate');
var tabela7 = document.getElementById('lista');
filtro7.onkeyup = function() {
    var nomeFiltro = filtro7.value.toUpperCase();
    for (var i = 1; i < tabela7.rows.length; i++) {
        if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1)
        {
                var conteudoCelula = tabela.rows.cells[6].textContent;
        }
        else
        {
                var conteudoCelula = tabela.rows.cells[6].innerText;
        }
        var corresponde = conteudoCelula.toUpperCase().indexOf(nomeFiltro) >= 0;
        tabela7.rows.style.display = corresponde ? '' : 'none';
    }
};
}
</script>

      </head>
      <body background="/dfhwbimg/background1.gif" style="margin:0px; padding: 0px">
  <div style="width:100%; height: 5%; background-color:#000000; margin-top:0px; margin-bottom:20px; padding:0px">
    <table width="100%">
      <tr>
       <td width="90%">
          <h5 style="color:#ffffff; font-family:Arial; padding-top:5px; margin:0px; text-align:center">RELAÇÃO DE AORS DO PROCST ADM$WEB  - Web transações administrativas                                    </h5>
       </td>
    </table>
</div>
    <table width="100%" CELLSPACING="3" CELLPADDING="3" BORDER="0" CLASS="sortable" ID="lista">
        <tr width="100%">
            <th style="width:05%"><div>APPLID</div><input id="filtro-applid" size="8" maxlength="8"/></th>
            <th style="width:05%"><div>CEC</div><input id="filtro-cec" size="2" maxlength="2"/></th>
            <th style="width:05%"><div>SMFID</div><input id="filtro-smfid" size="4" maxlength="4"/></th>
            <th style="width:05%"><div>PROCSTEP</div><input id="filtro-procstep" size="8" maxlength="8"/></th>
            <th style="width:05%"><div>STATUS</div><input id="filtro-status" size="8" maxlength="8"/></th>
            <th style="width:05%"><div>DESCRIÇÃO</div><input id="filtro-descricao" size="50" maxlength="50"/></th>
            <th style="width:05%"><div>STCSTATE</div><input id="filtro-stcstate" size="8" maxlength="8"/></th>
            <th style="width:05%">REPORT</th>
            <th style="width:05%">TRANS
            <th style="width:08%">CPU QR</th>
            <th style="width:05%">QRI(%)</th>
            <th style="width:05%">QRR(%)</th>
            <th style="width:05%">R-INT</th>
            <th style="width:05%">R-ACU</th>
            <th style="width:05%">TORS</th>
            <th style="width:05%">MXTS</th>
            <th style="width:08%">CPU L8</th>
            <th style="width:05%">SRB Time</th>
            <th style="width:08%">CPU ADS</th>
        </tr>
        
        <tr width="100%" bgcolor="#99CCFF">
            <td align=center bgcolor="#EB1515"><a href="http://172.17.71.53:04091/cics/MD99/MDPP6010/6010/PAOR/DAOR/?6966B8EE00000000000000002E4931260000000000000000000000002E44000C">CIC3A2W </td>
            <td align=center style="width:07%" bgcolor="#EB1515">    04 |  8%</td>
            <td align=center style="width:07%" bgcolor="#99CCFF">BSBO | 31%</td>
            <td align=center>    ADM$WEB </td>
            <td align=center><a href="http://172.17.71.53:04091/cics/MD99/MDPP6008/6008/PAOR/QUIE/?6966B8EE00000000000000002E4931260000000000000000000000002E44000C" onclick=" return confirm('Deseja alterar o status do AOR?')">ACTIVE</td>                                                   
            <td align=left>ADM$WEB  - ADM. WEB                                       </td>
            <td align=center bgcolor="#99CCFF">Running             </td>
            <td align=center>18:49:30</td>
            <td align=center bgcolor="#99CCFF">      354</td>
            <td align=center>     00:00,37993</td>
            <td align=center bgcolor="#99CCFF">  0</td>
            <td align=center> 93</td>
            <td align=center>        0</td>
            <td align=center>            0</td>
            <td align=center><a href="http://172.17.71.53:04091/cics/MD99/MDPP6007/6007/PAOR/ATOR/?6966B8EE00000000000000002E4931260000000000000000000000002E44000C"> 0</td>
            <td align=center> 999</td>
            <td align=center>     00:00,61597</td>
            <td align=center bgcolor="#99CCFF">00:00,01159</td>
            <td align=center>00:00,99620</td>
        </tr>
        
        <tr width="100%" bgcolor="#FFFFFF">
            <td align=center bgcolor="#FFFFFF"><a href="http://172.17.71.53:04091/cics/MD99/MDPP6010/6010/PAOR/DAOR/?6966B8EE00000000000000002E4935A00000000000000000000000002E44000C">CIC3A2X </td>
            <td align=center style="width:07%" bgcolor="#FFFFFF">    03 | 15%</td>
            <td align=center style="width:07%" bgcolor="#FFFFFF">BSBD | 14%</td>
            <td align=center>    ADM$WEB </td>
            <td align=center><a href="http://172.17.71.53:04091/cics/MD99/MDPP6008/6008/PAOR/QUIE/?6966B8EE00000000000000002E4935A00000000000000000000000002E44000C" onclick=" return confirm('Deseja alterar o status do AOR?')">ACTIVE</td>
            <td align=left>ADM$WEB  - ADM. WEB                                       </td>
            <td align=center bgcolor="#FFFFFF">Running             </td>
            <td align=center>18:49:27</td>
            <td align=center bgcolor="#FFFFFF">      564</td>
            <td align=center>     00:00,55272</td>
            <td align=center bgcolor="#FFFFFF">  0</td>
            <td align=center> 94</td>
            <td align=center>        0</td>
            <td align=center>            0</td>
            <td align=center><a href="http://172.17.71.53:04091/cics/MD99/MDPP6007/6007/PAOR/ATOR/?6966B8EE00000000000000002E4935A00000000000000000000000002E44000C"> 0</td>
            <td align=center> 999</td>
            <td align=center>     00:00,96758</td>
            <td align=center bgcolor="#FFFFFF">00:00,01431</td>
            <td align=center>00:01,49954</td>
        </tr>
        <tr width="100%" bgcolor="#99CCFF">
            <td align=center bgcolor="#99CCFF"><a href="http://172.17.71.53:04091/cics/MD99/MDPP6010/6010/PAOR/DAOR/?6966B8EE00000000000000002E493A1A0000000000000000000000002E44000C">CIC3A2Y </td>
            <td align=center style="width:07%" bgcolor="#99CCFF">    05 | 11%</td>
            <td align=center style="width:07%" bgcolor="#99CCFF">BSBG | 27%</td>
            <td align=center>    ADM$WEB </td>
            <td align=center><a href="http://172.17.71.53:04091/cics/MD99/MDPP6008/6008/PAOR/QUIE/?6966B8EE00000000000000002E493A1A0000000000000000000000002E44000C" onclick=" return confirm('Deseja alterar o status do AOR?')">ACTIVE</td>
            <td align=left>ADM$WEB  - ADM. WEB                                       </td>
            <td align=center bgcolor="#99CCFF">Running             </td>
            <td align=center>18:49:28</td>
            <td align=center bgcolor="#99CCFF">      356</td>
            <td align=center>     00:00,43251</td>
            <td align=center bgcolor="#99CCFF">  0</td>
            <td align=center> 96</td>
            <td align=center>        0</td>
            <td align=center>            0</td>
            <td align=center><a href="http://172.17.71.53:04091/cics/MD99/MDPP6007/6007/PAOR/ATOR/?6966B8EE00000000000000002E493A1A0000000000000000000000002E44000C"> 0</td>
            <td align=center> 999</td>
            <td align=center>     00:00,63040</td>
            <td align=center bgcolor="#99CCFF">00:00,01440</td>
            <td align=center>00:01,06316</td>
        </tr>
        <tr width="100%" bgcolor="#FFFFFF">
            <td align=center bgcolor="#E8EC10"><a href="http://172.17.71.53:04091/cics/MD99/MDPP6010/6010/PAOR/DAOR/?6966B8EE00000000000000002E493E940000000000000000000000002E44000C">CIC3A2Z </td>
            <td align=center style="width:07%" bgcolor="#E8EC10">    07 |  9%</td>
            <td align=center style="width:07%" bgcolor="#FFFFFF">BSBH | 31%</td>
            <td align=center>    ADM$WEB </td>
            <td align=center><a href="http://172.17.71.53:04091/cics/MD99/MDPP6008/6008/PAOR/QUIE/?6966B8EE00000000000000002E493E940000000000000000000000002E44000C" onclick=" return confirm('Deseja alterar o status do AOR?')">ACTIVE</td>
            <td align=left>ADM$WEB  - ADM. WEB                                       </td>
            <td align=center bgcolor="#FFFFFF">Running             </td>
            <td align=center>18:49:28</td>
            <td align=center bgcolor="#FFFFFF">      388</td>
            <td align=center>     00:00,46110</td>
            <td align=center bgcolor="#FFFFFF">  0</td>
            <td align=center> 90</td>
            <td align=center>        0</td>
            <td align=center>            0</td>
            <td align=center><a href="http://172.17.71.53:04091/cics/MD99/MDPP6007/6007/PAOR/ATOR/?6966B8EE00000000000000002E493E940000000000000000000000002E44000C"> 0</td>
            <td align=center> 999</td>
            <td align=center>     00:00,75193</td>
            <td align=center bgcolor="#FFFFFF">00:00,01645</td>
            <td align=center>00:01,21451</td>
        </tr>
</table>
<script>
   zebra('lista', 'linhaaz');
</script>
</table>
<div style="width:100%">
   <table ALIGN="CENTER" BORDER="0">
     <tr>
       <td colspan="4" align="center" style="padding-top:45px"><input type="button" value="Voltar" style="width: 100px; height:30px;
       font-family:Verdana,Helvetica; font-weight:bold; color:white; background:#3366cc; border-radius:15px;cursor:hand" onClick="location.href = 'http://172.17.71.53:04091/cics/MD99/MDPP6013/6013/6013/PMEN/?6966B8EE00000000000000002E44000C0000000000000000000000002E44000C'"></td>
       <td colspan="4" align="center" style="padding-top:45px"><input type="button" value="Refresh" style="width: 100px; height:30px;
       font-family:Verdana,Helvetica; font-weight:bold; color:white; background:#3366cc; border-radius:15px;cursor:hand" onClick="window.location.reload()"></td>
     </tr>
   </table>

 

**********************************************************************************************************************************************************************************

 

Se puderem ajudar ou dar uma luz fico muito agradecido;

 

Att

Fábio

Compartilhar este post


Link para o post
Compartilhar em outros sites

Que tal cookies? Eu usaria uma DB se estiver trabalhando com logins e for importante guardar esses valores em qualquer browser, do contrário cookies ou até sessions (através de plugin) solucionarão seu problema.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar agora





Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas publicações sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×