|
TDC-tabel met
lichtband
a.Bestanden
-TDC-index : Hoofdbestand : menu + iframe
-TDC-bestand dat wordt geladen in het iframe
-TDC-data tekstbestand
-htm link bestanden : 0001htm,0002.htm etc...
b.Resultaat
-Tabel met zoek(licht)-band.
-Doorschakeling naar webpagina bij-klik.
c.Voordeel
-Je hoeft alleen bij het toevoegen van nieuwe paginas de nummering te
volgen.
-Je hoeft enkel een nieuw record aan te maken in het tekstbestand.
1.TDCindex.htm
| Code: |
<html>
<head>
<title>Tabelvoorbeeld tdc : HTML-menu</title>
</head>
<body leftmargin="0" topmargin="0" link="#FFFFFF" vlink="#C0C0C0"
alink="#FF9900">
<div align="left">
<table border="0" width="100%" height="15" background="uw-logo.jpg"
style= "background-repeat: No-repeat" cellspacing="0">
<tr>
<td width="67%" height="55" valign="top" bgcolor="#4C718C"
background="../LogoBl.jpg" align="center"> </td>
</tr>
<tr>
<td width="67%" height="4" valign="top" bgcolor="#FFFFFF"
style="border-style: groove; border-width: 2" align="center">
<font face="Comic Sans MS"> TDC
tabelvoorbeeld</font>
</td>
</tr>
<tr>
<td width="67%" height="1" valign="top" bgcolor="#4C718C">
<font size="2" face="Tahoma" color="#FFFFFF">
[<a href="index.htm">Home</a>]
[<a href="TDCindex.htm">Terug</a>]</font></font>
</td>
</tr>
</table>
</div>
<iframe name="hoofd" src="TDCtabel.htm" width="100%" height =
"90%">
</iframe>
</body>
</html>
|
2.TDCtabel.htm
| Code: |
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>TDC-Voorbeeld</title>
<SCRIPT language="JavaScript">
function haalelement(el) {
var tagList = new Object
for (var i = 1; i < arguments.length; i++)
tagList[arguments[i]] = true
while ((el!=null) && (tagList[el.tagName]==null))
el = el.parentElement
return el
}
function lichtband(janee) {
var el = haalelement(event.srcElement,"TD")
if (el==null) return
if (el.tagName=="TD") {
var rij = haalelement(el, "TR")
if (janee)
rij.className = "rijover"
else
rij.className = ""
}
}
function Sorteer(Kolom)
{
TDC1.SortAscending=true;
TDC1.SortColumn=Kolom;
TDC1.Reset();
}
function Zoeken()
{
TDC1.FilterColumn=Zoekinkolom.value;
TDC1.FilterValue=Zoektekst.value;
TDC1.FilterCriterion="=";
TDC1.Reset();
}
function Ververs()
{
TDC1.FilterCriterion="";
TDC1.SortAscending=true;
TDC1.SortColumn="ID";
TDC1.Reset()}
</SCRIPT>
<STYLE>
#Tabelrooster1 TBODY {cursor: hand}
.rijover {background-color:#435C77;color:white}
</STYLE>
</head>
<BODY bgcolor="#D4D0C8" topmargin="0" leftmargin="0">
<OBJECT
id=TDC1
classid=clsid:333C7BC4-460F-11D0-BC04-0080C7055A83
width=0 height=0>
<PARAM NAME="RowDelim" VALUE="
">
<PARAM NAME="FieldDelim" VALUE=";">
<PARAM NAME="TextQualifier" VALUE='"'>
<PARAM NAME="EscapeChar" VALUE="">
<PARAM NAME="UseHeader" VALUE="-1">
<PARAM NAME="SortAscending" VALUE="-1">
<PARAM NAME="SortColumn" VALUE="">
<PARAM NAME="FilterValue" VALUE="">
<PARAM NAME="FilterCriterion" VALUE="??">
<PARAM NAME="FilterColumn" VALUE="">
<PARAM NAME="CharSet" VALUE="">
<PARAM NAME="Language" VALUE="nl">
<PARAM NAME="CaseSensitive" VALUE="-1">
<PARAM NAME="Sort" VALUE="">
<PARAM NAME="Filter" VALUE="">
<PARAM NAME="AppendData" VALUE="0">
<PARAM NAME="DataURL" VALUE="TDCdata.txt">
<PARAM NAME="ReadyState" VALUE="4">
</OBJECT>
<div align="center">
<TABLE id="Tabelrooster1" datasrc="#TDC1" datapagesize="10" width="924"
height="116"
bordercolorlight="#D4D0C8" border="1" bordercolordark="#D4D0C8"
cellspacing="0" cellpadding="2" bgcolor="#FFFFFF">
<THEAD>
<tr>
<td width="912" bgcolor="#d4d0c8" colspan="5" valign="top"
bordercolorlight="#D4D0C8" bordercolordark="#D4D0C8">
<font face="Verdana" size="2">***** </font><input ID="Zoektekst"
value="0001" size ="25"
style="width: 146; height: 22; border-style: groove;
border-width: 2px" name="Zoektekst">
<font face="Verdana" size="2"> in field </font><select size="1"
ID="Zoekinkolom" style="LEFT: 1px;">
<option value="ID" selected>RecID</option>
<option value="">AUTEUR</option>
<option value="SCRIPT">SCRIPT</option>
<option value="EMAIL">EPOST</option>
</select>
<input type="button" value="Voer uit" ONCLICK=Zoeken()
name="Knop_Zoek"
style="BORDER-RIGHT: 2px groove; BORDER-TOP: 2px groove;
BORDER-LEFT: 2px groove; WIDTH: 69px;
BORDER-BOTTOM: 2px groove; HEIGHT: 22px; BACKGROUND-COLOR: #ffffff"><input
type="button" value="Reset" ONCLICK=Ververs() name="Knop_Reset"
style="BORDER-RIGHT: 2px groove; BORDER-TOP: 2px groove;
BORDER-LEFT: 2px groove; WIDTH: 69px;
BORDER-BOTTOM: 2px groove; HEIGHT: 22px; BACKGROUND-COLOR:
#ff0000">
<input type="button" value="<"onclick="document.all.Tabelrooster1.previousPage();"
name="Knop_Vorig"
style="width: 36;relative; height: 22; background-color: #ffffc0;
border-style: groove; border-width: 2px">
<input type="button" value=">" onclick="document.all.Tabelrooster1.nextPage();"
name="Knop_Volgend"
style="width: 36;relative; height: 22; background-color: #ffffc0;
border-style: groove; border-width: 2px">
<font face="Verdana" size="1">pwProTech</font>
</td>
</tr>
<tr >
<td width="47" style="border-style: groove; border-width: 2px"
bgcolor="#D4D0C8" bordercolorlight="#FFFFFF" bordercolordark="#000000">
<INPUT TYPE=button VALUE="Nr" ONCLICK='Sorteer("ID")' style="height:
20; border-style: groove; border-width: 2px"></td>
<td width="404" height="1" style="border-style: groove;
border-width: 2px" bgcolor="#D4D0C8" bordercolorlight="#FFFFFF"
bordercolordark="#000000">
<INPUT TYPE=button VALUE="Titel document" ONCLICK='Sorteer("TITEL")'
style="width: 104; height: 20; border-style: groove; border-width:
2px"></td>
<td width="153" height ="1" style="border-style: groove;
border-width: 2px" bgcolor="#D4D0C8" bordercolorlight="#FFFFFF"
bordercolordark="#000000">
<INPUT TYPE=button VALUE="Auteur" ONCLICK='Sorteer("AUTEUR")'
style="width: 64; height: 20; border-style: groove; border-width:
2px"></td>
<td width="63" height="1" style="border-style: groove;
border-width: 2px" bgcolor="#D4D0C8" bordercolorlight="#FFFFFF"
bordercolordark="#000000">
<INPUT TYPE=button VALUE="Script" ONCLICK='Sorteer("SCRIPT")'
style="width: 58; height: 20; border-style: groove; border-width:
2px"></td>
<td width="213" bgcolor="#d4d0c8" height="1" style="border-style:
groove; border-width: 2px" bordercolorlight="#FFFFFF"
bordercolordark="#000000">
<INPUT TYPE=button VALUE="Epost" ONCLICK='Sorteer("EPOST")' style="width:
68; height: 20; border-style: groove; border-width: 2px"></td>
</tr>
</THEAD>
<TBODY ONMOUSEOVER="lichtband(true)" ONMOUSEOUT="lichtband(false)">
<tr><a datafld="NAARSCHAKEL" >
<td width="49" bordercolorlight="#808080" bordercolordark="#808080"><span
datafld="ID"></td>
<TD width="406" bordercolorlight="#808080" bordercolordark="#808080"
><span datafld="TITEL"></TD>
<td width="155" bordercolorlight="#808080" bordercolordark="#808080"><span
datafld="AUTEUR"></td>
<td width="65" bordercolorlight="#808080" bordercolordark="#808080"><span
datafld="SCRIPT"></td>
<td width="215" bordercolorlight="#808080" bordercolordark="#808080"
><span datafld="EPOST"></td>
</a></tr>
<TBODY>
<TFOOT>
<tr id="voeter">
<td colspan=5 bgcolor="#d4d0c8" width="914">
<script langauge="JavaScript">document.write(Date());</script>
</td>
</tr>
</TFOOT>
</TABLE>
</div>
</BODY></html>
|
3.TDCdata.txt
|
Code: |
NAARSCHAKEL;ID;TITEL;AUTEUR;SCRIPT;EPOST
0001.htm;0001;Toolbar Select Case;pw;VB-script;Email1@provider.com
0002.htm;0002;pwProTech;kc;Redirect;Email2@provider.com
http://www.orchicat.tribuun.com;0003;Orchids;pw;Html-page;Email3@provider.com
|
|
