Jump to content

POWERED BY:

Archived

This topic is now archived and is closed to further replies.

alicacwb

Filtro dinâmico

By alicacwb, in Javascript

Recommended Posts

alicacwb    0

alicacwb
Posted

Divirtão-se...

http://forum.imasters.com.br/public/style_emoticons/default/bye1.gif

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>Filtro</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  <script type="text/javascript">    function filter (phrase, _id, cellNr){  var suche = phrase.value.toLowerCase();  var table = document.getElementById(_id);  var ele;  for (var r = 1; r < table.rows.length; r++){  	ele = table.rows[r].cells[cellNr].innerHTML.replace(/<[^>]+>/g,"");  	if (ele.toLowerCase().indexOf(suche)>=0 )    table.rows[r].style.display = '';  	else table.rows[r].style.display = 'none';  }	}  </script></head><body><table width="100%" border="0">  <tr>    <td width="301"><input name="filt" type="text" onKeyUp="filter(this, 'lista', '0')"></td>    <td width="100"><input name="filt2" type="text" onKeyUp="filter(this, 'lista', '1')"></td>    <td width="135"><input name="filt3" type="text" onKeyUp="filter(this, 'lista', '2')"></td>    <td width="146"><input name="filt4" type="text" onKeyUp="filter(this, 'lista', '3')"></td>    <td width="48"><input name="filt5" type="text" onKeyUp="filter(this, 'lista', '4')"></td>  </tr></table><form>       <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" id="lista">      <tr valign="middle">        <td width="301"></td>        <td width="100"></td>        <td width="135"></td>        <td width="146"></td>        <td width="48"></td>      </tr>      <tr>        <td>ALESSANDRA SILVA</td>        <td>Funcionário</td>        <td>MECÂNICA</td>        <td>DESENHISTA PROJETISTA MECÂNICO</td>        <td>Ativo</td>      </tr>      <tr>        <td>ALEXSANDRO</td>        <td>Consultor</td>        <td>MECÂNICA</td>        <td>DESENHISTA</td>        <td>Ativo</td>      </tr>      <tr>        <td>AMARILDO LUIZ</td>        <td>Funcionário</td>        <td>INDUSTRIAL</td>        <td>AUXILIAR SERVIçOS GERAIS</td>        <td>Ativo</td>      </tr>      <tr>        <td>ALDRIN ROSA</td>        <td>Estagiário</td>        <td>E&I </td>        <td>ESTAGIáRIO</td>        <td>Inativo</td>      </tr>      <tr>        <td>ALINE CAMILA</td>        <td>Consultor</td>        <td>ADMINISTRATIVO</td>        <td>TÉCNICO EM INFORMÁTICA</td>        <td>Inativo</td>      </tr>      <tr>        <td>SANDRO MANGOLO</td>        <td>Terceirizado</td>        <td>INDUSTRIAL</td>        <td>AUXILIAR SERVIçOS GERAIS</td>        <td>Inativo</td>      </tr>      <tr>        <td>WILLIAN MARCOS</td>        <td>Estagiário</td>        <td>MECÂNICA</td>        <td>ESTAGIáRIO</td>        <td>Inativo</td>      </tr>    </table></form>  </body></html>

Share this post

Link to post
Share on other sites

Crystian    0

Crystian
Posted

Muito Bom, só faltaria você manter a pesquisa, dessa forma para vários registros você poder colocar dois ou mais critérios de pesquisa.Abraço

Share this post

Link to post
Share on other sites

Mr Crowley    0

Mr Crowley
Posted

muito bom mesmo esse scriptvai me ajudar em muita coisas...hehehe outra...qdo você muda de campo como nome para funcionario, ele disconsidera o outro campo e considera o campo atula que você esta modificando o valorexiste um modo dele considerar todos so mesmo tempo?desculpa abusar da boa vontade, mais eu nao entendo de java script, apenas o basico do basico....mais desde ja obrigado e ate mais a todos...falow.....

Share this post

Link to post
Share on other sites

alicacwb    0

alicacwb
Posted

bem, agora cada um modifica do jeito que precisa ;)

alias, fica de desafio pra vcs, mudar esse script pra considerar mais que um parametro de pesquisa!! heauehauhea vamo v quem acaba primeiro! http://forum.imasters.com.br/public/style_emoticons/default/clap.gif

 

http://forum.imasters.com.br/public/style_emoticons/default/kiss.gif http://forum.imasters.com.br/public/style_emoticons/default/bye1.gif

Share this post

Link to post
Share on other sites

hifi    0

hifi
Posted

ta ai então.. com mais de um parametro de pesquisa:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>Filtro</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script type="text/javascript"> function filter (_id){	var _naw;	var disp;	var table = document.getElementById(_id);	var ele;		for (var r = 1; r < table.rows.length; r++) {  disp="";  for (i=0; i<=4; i++) { 	 if(eval("document.form.filt"+i+".value").toLowerCase()!="") {    ele = table.rows[r].cells[i].innerHTML.replace(/<[^>]+>/g,"");    if (ele.toLowerCase().indexOf(document.getElementById("filt"+i).value.toLowerCase())==-1) {   	 disp="none";    } 	 }  }  table.rows[r].style.display = disp;	}} </script></head><body><form name="form"> <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" id="lista"> <tr>   <td width="301"><input name="filt0" type="text" onKeyUp="filter('lista')"></td>   <td width="100"><input name="filt1" type="text" onKeyUp="filter('lista')"></td>   <td width="135"><input name="filt2" type="text" onKeyUp="filter('lista')"></td>   <td width="146"><input name="filt3" type="text" onKeyUp="filter('lista')"></td>   <td width="48"><input name="filt4" type="text" onKeyUp="filter('lista')"></td> </tr>     <tr valign="middle">       <td width="301"></td>       <td width="100"></td>       <td width="135"></td>       <td width="146"></td>       <td width="48"></td>     </tr>     <tr>       <td>ALESSANDRA SILVA</td>       <td>Funcionário</td>       <td>MECÂNICA</td>       <td>DESENHISTA PROJETISTA MECÂNICO</td>       <td>Ativo</td>     </tr>     <tr>       <td>ALEXSANDRO</td>       <td>Consultor</td>       <td>MECÂNICA</td>       <td>DESENHISTA</td>       <td>Ativo</td>     </tr>     <tr>       <td>AMARILDO LUIZ</td>       <td>Funcionário</td>       <td>INDUSTRIAL</td>       <td>AUXILIAR SERVIçOS GERAIS</td>       <td>Ativo</td>     </tr>     <tr>       <td>ALDRIN ROSA</td>       <td>Estagiário</td>       <td>E&I </td>       <td>ESTAGIáRIO</td>       <td>Inativo</td>     </tr>     <tr>       <td>ALINE CAMILA</td>       <td>Consultor</td>       <td>ADMINISTRATIVO</td>       <td>TÉCNICO EM INFORMÁTICA</td>       <td>Inativo</td>     </tr>     <tr>       <td>SANDRO MANGOLO</td>       <td>Terceirizado</td>       <td>INDUSTRIAL</td>       <td>AUXILIAR SERVIçOS GERAIS</td>       <td>Inativo</td>     </tr>     <tr>       <td>WILLIAN MARCOS</td>       <td>Estagiário</td>       <td>MECÂNICA</td>       <td>ESTAGIáRIO</td>       <td>Inativo</td>     </tr>   </table></form>  </body></html>

Share this post

Link to post
Share on other sites

wmssuper    0

wmssuper
Posted

Nossa, o script é show mano!!! Parabéns e brigadão!! http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

 

Eu só tenho uma dúvida: tirei duas colunas (as duas últimas), e o filtro não funcionou mais.. é possível personalizar o número de campos/colunas?

 

Mais uma vez obrigado. http://forum.imasters.com.br/public/style_emoticons/default/bye1.gif

 

Wmssuper.

Share this post

Link to post
Share on other sites

EderBaum    0

EderBaum
Posted

Mas se eu precisar inserir um link no nome por exemplo???

 

  <tr>       <td><a href="http://www.umaurl.com/dir?par=2">ALESSANDRA SILVA</a></td>       <td>Funcionário</td>       <td>MECÂNICA</td>       <td>DESENHISTA PROJETISTA MECÂNICO</td>       <td>Ativo</td>     </tr>

Como faço para trabalhar com isso?

Share this post

Link to post
Share on other sites

Otata    4

Otata
Posted

para funcionar no ff, coloque o id nos input

 

 <tr>
   <td width="301"><input id="filt0" type="text" onkeyup="filter('lista')"></td>
   <td width="100"><input id="filt1" type="text" onkeyup="filter('lista')"></td>
   <td width="135"><input id="filt2" type="text" onkeyup="filter('lista')"></td>
   <td width="146"><input id="filt3" type="text" onkeyup="filter('lista')"></td>
   <td width="48"><input id="filt4" type="text" onkeyup="filter('lista')"></td>
 </tr>

t+

Share this post

Link to post
Share on other sites

Heber Almeida    0

Heber Almeida
Posted

Opa otata valeu o codigo funfou no ff, mas as tabelas que mostram o resultado ficaram desconfiguradas mesmo alterando o valor da largura correta que não tinha valor, como resolver este segundo problema. valeu!

Share this post

Link to post
Share on other sites
Go To Topic Listing Javascript
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.

  I accept