ALGUIEN SABE DONDE PUEDO ENCONTRAR UN SCRIPT COMO ESTE PERO ESCRITO EN PHP
GRACIAS DE ANTE MANO..
<html>
<head>
<title> Sortable/Searchable Table Example </title>
<script language="JavaScript">
<!--
/*
######################################################################
# #
# Sortable Tables #
# --------------- #
# #
# P.Whitrow #
# 03/05/2002 #
# #
######################################################################
*/
document.write('<style>')
document.write('.arrow {font-family:webdings;font-size:10;text-decoration:none;}')
document.write('table {font-family:verdana;font-size:11;}')
document.write('button {font-family:verdana;font-size:11;border:1 solid;}')
document.write('input {font-family:verdana;font-size:11;border:1 solid;}')
document.write('.text {font-family:verdana;font-size:10;}')
document.write('A {text-decoration:none;}')
document.write('A:hover {text-decoration:none;}')
document.write('</style>')
// column assosiations (default 26 columns, but can be more)
function dataArray(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z) {
this.col1=a;this.col2=b;this.col3=c;this.col4=d;this.col5=e;this.col6=f;this.col7=g;this.col8=h;this.col9=i;this.col10=j;this.col11=k;this.col12=l;this.col13=m;this.col14=n;this.col15=o;this.col16=p;this.col17=q;this.col18=r;this.col19=s;this.col20=t;this.col21=u;this.col22=v;this.col23=w;this.col24=x;this.col25=y;this.col26=z
}
function createTable(tableName,tableHolderName){
str='<br><table border=0 id="'+tableName+'" style="background:'+tableBgColor+';" onclick="hilightRow();blurMe()"><caption align=top><b><u>'+table_title+'</u></b></caption><caption align=left><hr width="100%"><input type="text" id="findText"> <button onclick="this.blur();findData()">Find</button> <button onclick="this.blur();findData()">Clear</button><div id="findResult" class="text">(Search Results)</div><hr width="100%">'+extra_table_data+'<br></caption>'
for(a=0;a<hd.length;a++){
if(a==0){
if(rowNumbersEnabled=='yes'){
str+='<tr><td type="header"><b>'+hd[a]+'</b></td>'
}
}else{
str+='<td type="header"><b>'+hd[a]+'</b> <a href="#" onclick="sortBy(\'col'+a+'\',\''+tableName+'\',this)" class="arrow" style="color:'+headerTxtColor+';" title="Ascending Order">5</a></td>'
}
}
str+='</tr></table>'
document.getElementById(tableHolderName).innerHTML=str
makeTable(tableName)
}
function makeTable(tableName){
tb=document.getElementById(tableName)
ft=document.getElementById('findText')
fr=document.getElementById('findResult')
for (a=0;a<da.length;a++){
tb.insertRow()
r=tb.rows[tb.rows.length-1];r.type="tableDataRow";r.style.background=dataBgColor;
if(rowNumbersEnabled=='yes'){
c0 = r.insertCell();c0.innerText=a+1;c0.type='header'
}
for(b=1;b<hd.length;b++){
tmp='da['+a+'].col'+b
tmp2=eval(tmp)
switch (true){
// web address
case (tmp2.indexOf('http://')>=0||tmp2.indexOf('https://')>=0):
com='c'+b+'=r.insertCell();c'+b+'.innerHTML="<a href=\'#\' value=\''+tmp2+'\' style=\'color:'+linkTxtColor+';\' onmouseover=this.style.color=\''+linkHoverColor+'\' onmouseout=this.style.color=\''+linkTxtColor+'\' onclick=\'gotoAddress(this.value)\' type=\'linker\' title=\'Click here open a window for this location.\'>'+tmp2+'</a>";c'+b+'.width=\''+columnWidth+'\'';
break;
// email
case (tmp2.indexOf('@')>=0&&tmp2.indexOf('.')>=0):
com='c'+b+'=r.insertCell();c'+b+'.innerHTML="<a style=\'color:'+linkTxtColor+';\' onmouseover=this.style.color=\''+linkHoverColor+'\' onmouseout=this.style.color=\''+linkTxtColor+'\' href=\'mailto:'+tmp2+'\' type=\'linker\' title=\'Click here to send email.\'>'+tmp2+'</a>";c'+b+'.width=\''+columnWidth+'\'';
break;
// standard text
default:
com='c'+b+'=r.insertCell();c'+b+'.innerHTML="'+tmp2+'";c'+b+'.width=\''+columnWidth+'\'';
break;
}
eval(com)
}
}
i=document.getElementsByTagName('TD')
for(a=0;a<i.length;a++){
if(i[a].type=='header'){
i[a].style.background=headerBgColor
i[a].style.color=headerTxtColor
i[a].style.cursor='default'
}
}
fr.innerText='(Search Results)'
}
function clearTable(tableName){
tb=document.getElementById(tableName)
i=tb.rows.length
for(a=1;a<i;a++){
tb.deleteRow()
}
}
var retVal=0
function sortBy(prop,tableName,dir) {
ft=document.getElementById('findText')
fr=document.getElementById('findResult')
fr.innerText='Sorting Data .. Please Wait ...'
tb=document.getElementById(tableName)
retVal=0
sortProp=prop;
if(dir.innerText=='5'){
dir.innerText='6'
dir.title="Descending Order"
da=da.sort(sortFuncUp)
}else{
dir.innerText='5'
dir.title="Ascending Order"
da=da.sort(sortFuncDn)
}
clearTable(tableName)
makeTable(tableName)
}
function sortFuncUp(dataArray1,dataArray2) {
if (dataArray1[sortProp]>dataArray2[sortProp]) retVal=1;
else if (dataArray1[sortProp]<dataArray2[sortProp]) retVal=-1;
else retVal=1;
return retVal;
}
function sortFuncDn(dataArray1,dataArray2) {
if (dataArray1[sortProp] < dataArray2[sortProp]) return (retVal ? -1: 1);
else if (dataArray1[sortProp] > dataArray2[sortProp]) return (retVal ? 1: -1);
else return 0;
}
var clearingTable=false
function findData(){
var seperator='~'
ft=document.getElementById('findText')
fr=document.getElementById('findResult')
if(event.srcElement.innerText=='Clear'){
clearingTable=true
}
if(ft.value!=''){
var dataQty=0
i=document.getElementsByTagName('TR')
for(a=0;a<i.length;a++){
if(i[a].type!='header'){
var startNum
if(rowNumbersEnabled=='yes'){
startNum=1
}else{
startNum=0
}
tmp=''
for(x=startNum;x<i[a].childNodes.length;x++){
tmp+=i[a].childNodes[x].innerText+seperator
}
if(tmp.indexOf(ft.value)>=0){
i(a).style.background=hilightBgColor
//i(a).scrollIntoView(true);
dataQty++
}else{
i(a).style.background=dataBgColor
}
}
}
fr.innerText=dataQty+" Tablas encontradas '"+ft.value+"' en base."
if(clearingTable){
ft.value=''
fr.innerText='(Search Results)'
clearingTable=false
}
}
}
var lastColor
function hilightRow(){
if(event.srcElement.parentElement.tagName=='TR'&&event.srcElement.parentElement.type=='tableDataRow'){
bgc=event.srcElement.parentElement
if(bgc.style.background==hilightRowColor){
bgc.style.background=lastColor
}else{
lastColor=bgc.style.background
bgc.style.background=hilightRowColor
}
}
}
function blurMe(){
if(event.srcElement.tagName=='A'){
event.srcElement.blur()
}
}
function gotoAddress(val){
blurMe()
window.open(val,'','')
}
//-->
</script>
<script language="JavaScript">
<!--
// Table/Data colors
tableBgColor= '#000000'
headerTxtColor= '#FFFFFF'
headerBgColor= '#7F7F7F'
dataTxtColor= '#000000'
dataBgColor= '#CFCFCF'
hilightRowColor= '#ff0000'
hilightBgColor= '#FF9900'
linkTxtColor= '#0033FF'
linkHoverColor= '#FF6633'
// column width
columnWidth='150'
// show row numbers
rowNumbersEnabled='yes'
// Table Heading (and any extra data)
table_title='<b><u><font size="3">Sortable/Searchable Table Example</font></u></b>'
extra_table_data="<u>Instructions</u><br>Highlight rows by clicking them..<br>Sort columns by clicking the arrow in the header..<br>Web links and Email addresses are automatically detected and made active..<br>Row numbering can be On or Off..<br>Up to 26 columns and unlimited rows..<br>Find data anywhere in the table by using the search facility..<br>"
hd=new Array();hd[0]=""
// Column Headings go here..
hd[1]="Name"
hd[2]="Address"
hd[3]="Email"
hd[4]="Description"
// add more column headings here ...
da=new Array();
// Table/Column data goes here..
// ALL links must start with http:// or https://
da[0]=new dataArray('Google','http://www.google.com','them@google.com','Search Engine');
da[1]=new dataArray('Yahoo','http://www.yahoo.com','them@yahoo.com','Search Engine');
da[2]=new dataArray('MSN','http://www.msn.com','them@msn.com','MS owned website');
da[3]=new dataArray('Lycos','http://www.lycos.com','them@lycos.com','Search Engine');
da[4]=new dataArray('P.Whitrow','http://www.pwhitrow.com','paul@pwhitrow.com','My website');
da[5]=new dataArray('Microsoft','http://www.microsoft.com','them@microsoft.com','Big Daddy..!');
da[6]=new dataArray('Masters y Asociados','http://master.weboficial.com','mastersweb@gmail.com','Desarrollo de Web site.!');
// add more data here ...
//-->
</script>
</head>
<body>
<center>
<!-- Place the line below wherever you want the table to be -->
<span id="tableHolder"><script>createTable('table_name','tableHolder')</script></span>
</center>
</body>
</html>
![loco]( "loco")
