16/05/2008, 09:33
|
| | | Fecha de Ingreso: octubre-2005
Mensajes: 62
Antigüedad: 19 años, 1 mes Puntos: 0 | |
Respuesta: Campo de búsqueda sobre tabla html Hola!
Les paso acá el código, según el modelo que me pasaste, aplicado a mis datos... me quedó horrible!!
Ahi va...
Se los mando en dos partes, por la limitación de caracteres
----------------------
<html xmlns:o="urn:schemas-microsoft-com:office:office"
xmlns:x="urn:schemas-microsoft-com:office:excel"
xmlns="http://www.w3.org/TR/REC-html40">
<head>
<script type="text/javascript">
var colum=0; // columna por la que se filtrará
var valor; // value del botón que se ha pulsado
function selecciona(obj,num) {
t = document.getElementById('tab');
filas = t.getElementsByTagName('tr');
// Deseleccionar columna anterior
for (i=1; ele=filas[i]; i++)
ele.getElementsByTagName('td')[colum].className='';
// Seleccionar columna actual
colum=num;
for (i=1; ele=filas[i]; i++)
ele.getElementsByTagName('td')[colum].className='celdasel';
// Cambiar botón por cuadro de texto
valor = obj.value;
celda = obj.parentNode;
celda.removeChild(obj);
txt = document.createElement('input');
celda.appendChild(txt);
txt.focus();
txt.onblur = function() {ponerBoton(this,num)};
txt.onkeyup = function() {filtra(this.value)};
// Desactivar los demás botones
for (i=0; ele=t.getElementsByTagName('input')[i]; i++)
if (ele.type == 'button') ele.disabled=true;
}
function ponerBoton(obj,num) {
celda = obj.parentNode;
celda.removeChild(obj);
boton = document.createElement('input');
boton.type = 'button';
boton.value = valor;
boton.onclick = function() {selecciona(this,num)}
boton.onkeypress = function() {selecciona(this,num)}
celda.appendChild(boton);
// Activar botones
for (i=0; ele=t.getElementsByTagName('input')[i]; i++)
ele.disabled=false;
}
function filtra(txt) {
t = document.getElementById('tab');
filas = t.getElementsByTagName('tr');
for (i=1; ele=filas[i]; i++) {
texto = ele.getElementsByTagName('td')[colum].innerHTML.toUpperCase();
for (j=0; ra=document.forms[0].rad[j]; j++) // Comprobar radio seleccionado
if (ra.checked) num = j;
if (num==0) posi = (texto.indexOf(txt.toUpperCase()) == 0);
else if (num==1) posi = (texto.lastIndexOf(txt.toUpperCase()) == texto.length-txt.length);
else posi = (texto.indexOf(txt.toUpperCase()) != -1);
ele.style.display = (posi) ? '' : 'none';
}
}
</script>
<meta http-equiv=Content-Type content="text/html; charset=windows-1252">
<meta name=ProgId content=Excel.Sheet>
<meta name=Generator content="Microsoft Excel 11">
<link rel=File-List
href="Telefonos%20Publicos%20y%20Cabinas_archivos/filelist.xml">
<link rel=Edit-Time-Data
href="Telefonos%20Publicos%20y%20Cabinas_archivos/editdata.mso">
<link rel=OLE-Object-Data
href="Telefonos%20Publicos%20y%20Cabinas_archivos/oledata.mso">
<!--[if gte mso 9]><xml>
<o:DocumentProperties>
<o:Author>Telecom</o:Author>
<o:LastAuthor>Emilio Javier Leyes</o:LastAuthor>
<o:Created>2006-06-12T19:32:18Z</o:Created>
<o:LastSaved>2008-05-15T16:07:14Z</o:LastSaved>
<o:Company>Telecom</o:Company>
<o:Version>11.5606</o:Version>
</o:DocumentProperties>
</xml><![endif]-->
<style>
<!--table
{mso-displayed-decimal-separator:"\,";
mso-displayed-thousand-separator:"\.";}
@page
{margin:.98in .79in .98in .79in;
mso-header-margin:0in;
mso-footer-margin:0in;}
tr
{mso-height-source:auto;}
col
{mso-width-source:auto;}
br
{mso-data-placement:same-cell;}
.style0
{mso-number-format:General;
text-align:general;
vertical-align:bottom;
white-space:nowrap;
mso-rotate:0;
mso-background-source:auto;
mso-pattern:auto;
color:windowtext;
font-size:10.0pt;
font-weight:400;
font-style:normal;
text-decoration:none;
font-family:FrutigerRoman;
mso-generic-font-family:auto;
mso-font-charset:0;
border:none;
mso-protection:locked visible;
mso-style-name:Normal;
mso-style-id:0;}
td
{mso-style-parent:style0;
padding-top:1px;
padding-right:1px;
padding-left:1px;
mso-ignore:padding;
color:windowtext;
font-size:10.0pt;
font-weight:400;
font-style:normal;
text-decoration:none;
font-family:FrutigerRoman;
mso-generic-font-family:auto;
mso-font-charset:0;
mso-number-format:General;
text-align:general;
vertical-align:bottom;
border:none;
mso-background-source:auto;
mso-pattern:auto;
mso-protection:locked visible;
white-space:nowrap;
mso-rotate:0;}
.xl24
{mso-style-parent:style0;
font-weight:700;
text-align:center;
border:.5pt solid silver;
background:silver;
mso-pattern:auto none;}
.xl25
{mso-style-parent:style0;
font-weight:700;
text-align:center;
border-top:.5pt solid silver;
border-right:.5pt solid silver;
border-bottom:.5pt solid silver;
border-left:none;
background:silver;
mso-pattern:auto none;}
.xl26
{mso-style-parent:style0;
font-weight:700;
mso-number-format:"\@";
text-align:left;
border-top:.5pt solid silver;
border-right:.5pt solid silver;
border-bottom:.5pt solid silver;
border-left:none;
background:silver;
mso-pattern:auto none;
white-space:nowrap;
mso-text-control:shrinktofit;}
.xl27
{mso-style-parent:style0;
font-weight:700;
text-align:center;
border-top:.5pt solid silver;
border-right:none;
border-bottom:.5pt solid silver;
border-left:none;
background:silver;
mso-pattern:auto none;}
.xl28
{mso-style-parent:style0;
font-weight:700;
text-align:center;
border-top:.5pt solid silver;
border-right:none;
border-bottom:.5pt solid silver;
border-left:.5pt solid silver;
background:silver;
mso-pattern:auto none;}
.xl29
{mso-style-parent:style0;
font-weight:700;
text-align:left;
border-top:.5pt solid silver;
border-right:.5pt solid silver;
border-bottom:.5pt solid silver;
border-left:none;
background:silver;
mso-pattern:auto none;}
.xl30
{mso-style-parent:style0;
border-top:none;
border-right:none;
border-bottom:.5pt solid silver;
border-left:.5pt solid silver;}
.xl31
{mso-style-parent:style0;
border-top:none;
border-right:.5pt solid silver;
border-bottom:.5pt solid silver;
border-left:none;}
.xl32
{mso-style-parent:style0;
font-size:8.0pt;
mso-number-format:"\@";
border-top:none;
border-right:.5pt solid silver;
border-bottom:.5pt solid silver;
border-left:none;
white-space:nowrap;
mso-text-control:shrinktofit;}
.xl33
{mso-style-parent:style0;
font-size:8.0pt;
text-align:right;
border-top:none;
border-right:none;
border-bottom:.5pt solid silver;
border-left:none;}
.xl34
{mso-style-parent:style0;
font-size:8.0pt;
text-align:right;
border-top:none;
border-right:none;
border-bottom:.5pt solid silver;
border-left:.5pt solid silver;}
.xl35
{mso-style-parent:style0;
border-top:none;
border-right:none;
border-bottom:none;
border-left:.5pt solid silver;}
.xl36
{mso-style-parent:style0;
border-top:none;
border-right:.5pt solid silver;
border-bottom:none;
border-left:none;}
.xl37
{mso-style-parent:style0;
font-size:8.0pt;
mso-number-format:"\@";
border-top:none;
border-right:.5pt solid silver;
border-bottom:none;
border-left:none;
white-space:nowrap;
mso-text-control:shrinktofit;}
.xl38
{mso-style-parent:style0;
font-size:8.0pt;
text-align:right;}
.xl39
{mso-style-parent:style0;
font-size:8.0pt;
text-align:right;
border-top:none;
border-right:none;
border-bottom:none;
border-left:.5pt solid silver;}
.xl40
{mso-style-parent:style0;
mso-number-format:"Short Date";}
-->
</style>
<!--[if gte mso 9]><xml>
<x:ExcelWorkbook>
<x:ExcelWorksheets>
<x:ExcelWorksheet>
<x:Name>Hoja1</x:Name>
<x:WorksheetOptions>
<x:DefaultColWidth>10</x:DefaultColWidth>
<x:Print>
<x:ValidPrinterInfo/>
<x:PaperSizeIndex>9</x:PaperSizeIndex>
<x:HorizontalResolution>-4</x:HorizontalResolution>
<x:VerticalResolution>0</x:VerticalResolution>
</x:Print>
<x:Selected/>
<x:Panes>
<x:Pane>
<x:Number>3</x:Number>
<x:ActiveRow>9</x:ActiveRow>
<x:ActiveCol>7</x:ActiveCol>
</x:Pane>
</x:Panes>
<x:ProtectContents>False</x:ProtectContents>
<x:ProtectObjects>False</x:ProtectObjects>
<x:ProtectScenarios>False</x:ProtectScenarios>
</x:WorksheetOptions>
<x:Sorting>
<x:Sort>(1) N°</x:Sort>
</x:Sorting>
<x:PublishObjects>
<x:PublishObject>
<x:Id>28840</x:Id>
<x:DivID>911-Parque_28840</x:DivID>
<x:SourceType>SourceSheet</x:SourceType>
<x:HtmlType>HtmlStatic</x:HtmlType>
<x:Location HRef="F:\Telecom Cabinas\Telefonos Publicos y Cabinas.htm"/>
</x:PublishObject>
</x:PublishObjects>
</x:ExcelWorksheet>
<x:ExcelWorksheet>
<x:Name>Hoja2</x:Name>
<x:WorksheetOptions>
<x:DefaultColWidth>10</x:DefaultColWidth>
<x:ProtectContents>False</x:ProtectContents>
<x:ProtectObjects>False</x:ProtectObjects>
<x:ProtectScenarios>False</x:ProtectScenarios>
</x:WorksheetOptions>
__________________ Emilio J. Leyes
Ingeniero en Informática Salta, Argentina |