[HTML & Javascript] Include met variabelen?

Pagina: 1
Acties:

  • Rigi
  • Registratie: September 2001
  • Laatst online: 30-11-2018
Ik ben een site aan het maken waar een 10 mensen een logboek bijhouden. Ik heb nu 10 aparte html's staan die allemaal dmv javascript een tabel opbouwen. Bij elke verandering moet ik dus al die dingen veranderen, hoe kan ik het deel dat de berekening doet los maken van de data? en krijg ik dan geen problemen met de variabelen oid?

  • RM-rf
  • Registratie: September 2000
  • Laatst online: 23:23

RM-rf

1 2 3 4 5 7 6 8 9

als je niet aan een gecentraliseerde admin wilt op basis van een db of (xml)-filedata.

kun je ook je javascript/html oplossing optimaliseren, echter darvoor moeten we eerst zien hoe inefficient je huidige oplossing is, volgens mij kan je eventueel ook optimaliseren zodat je veranderingen enkel in een of twee files moet bijhouden

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen


  • Rigi
  • Registratie: September 2001
  • Laatst online: 30-11-2018
datum[entries] = "Maandag 31 maart";
tijd[entries] = "begintijd-eindtijd";
lengte[entries] = lengte activiteit in uren;
werk[entries] = "werk";
entries++;

document.writeln( "<TITLE>Logboek van " + naam + "</TITLE>" );

//-->
</SCRIPT>
<link rel="stylesheet" type="text/css" href="adlib.css">
</HEAD>
<BODY>
<SCRIPT LANGUAGE="JavaScript">
<!--
document.writeln( "<A NAME=\"top\"></A>" );
document.writeln( "<H2>Logboek van <EM>" + naam + "</EM></H2>" );
document.writeln("<STRONG>Laatst gewijzigd: " + document.lastModified + "</STRONG>");

document.write( "<P>" );
var k = 0;
var totaal = 0;
for( var i = 0; i < entries; i++ ) {
totaal += lengte[i];

if( week[k] == i ) {
document.writeln( "[ <A HREF=\"#week" + (k + 11) + "\">Week " + (k + 11) + "</A> ]" );
k++;
}
}
document.write( "</P>" );

document.writeln( "<H4>Totaal aantal uren: <EM>" + totaal + "</EM></H4>" );
//-->
</SCRIPT>

<P>

<SCRIPT LANGUAGE="JavaScript">
<!--
document.writeln( "<TABLE BORDER=0>" +
"<TR>" +
"<TH WIDTH=\"25%\">Datum" +
"</TH><TH WIDTH=\"15%\">Tijd" +
"</TH><TH WIDTH=\"10%\">Aantal uren" +
"</TH><TH COLSPAN=2 WIDTH=\"50%\">Verricht werk" +
"</TH></TR>"
);

var k = 0;
var weektotaal = 0;
var subtotaal = 0;
for( var i = 0; i < entries; i++ ) {
document.writeln( "<TR>" +
"<TD ALIGN=CENTER>" + datum[i] +
"</TD><TD ALIGN=CENTER>" + tijd[i] +
"</TD><TD ALIGN=CENTER>" + lengte[i] +
"</TD><TD COLSPAN=2 ALIGN=LEFT>" + werk[i] +
"</TD></TR>"
);

weektotaal += lengte[i];
subtotaal += lengte[i];
if( week[k] == i ) {
document.writeln( "<A NAME=\"week" + (k + 11) + "\"></A>" +
"<TR>" +
"<TH COLSPAN=2 ALIGN=CENTER>Totaal voor week " + (k + 11) +
"</TH><TH ALIGN=CENTER>" + weektotaal +
"</TH><TH ALIGN=CENTER>Subtotaal" +
"</TH><TH ALIGN=CENTER>" + subtotaal +
"</TH></TR><TR><TD COLSPAN=5>" +
"[ <A HREF=\"#top\">Terug naar boven</A> ]" +
"</TD></TABLE><BR>"
);

if( i != entries - 1 ) {
document.writeln( "<TABLE BORDER=0>" +
"<TR>" +
"<TH WIDTH=\"25%\">Datum" +
"</TH><TH WIDTH=\"15%\">Tijd" +
"</TH><TH WIDTH=\"10%\">Aantal uren" +
"</TH><TH COLSPAN=2 WIDTH=\"50%\">Verricht werk" +
"</TH></TR>"
);
}
else {
document.writeln( "</TABLE>" );
}

weektotaal = 0;
k++;
}
}
var temp;
for( temp = 0; temp < week.length && week[temp] < 9999; temp++ ) {}
document.writeln( '<font size="-1">Gemiddeld per week: <em>' + (Math.round(totaal/temp*1000)/1000) + '</em></font>' );
//-->
</SCRIPT>

</TABLE>
</BODY>


dis dus de html source met een voorbeeld van een entry

  • RM-rf
  • Registratie: September 2000
  • Laatst online: 23:23

RM-rf

1 2 3 4 5 7 6 8 9

Rigi schreef op 01 april 2003 @ 15:28:
datum[entries] = "Maandag 31 maart";
tijd[entries] = "begintijd-eindtijd";
lengte[entries] = lengte activiteit in uren;
werk[entries] = "werk";
entries++;

document.writeln( "<TITLE>Logboek van " + naam + "</TITLE>" );

//-->
</SCRIPT>
...
dis dus de html source met een voorbeeld van een entry
het lijkt me netter om gewoon een externe datafile te gebruiken, dus een .js file extern te laten laden voor alle in te lezen data.

verder heb je een vast format dus kun je eventueel ook gewoon je data inlezen in een 3D Array:
data[entries] = new Array("01.04.2003","15:39","blaat blaahaat")

dan is data[entries][0] de datum-waarde, data[entries][1]de tijd en data[entries][2] de text.

eventueel kan je je js-file ook gewoon een platte variabelle maken, waarin je op basis van newlines de data scheidt, of daarvoor speciale tekens gebruiken ('|' of '#' oid)

de datafile zal hoogstwaarschijnlijk redelijk beperkt blijven qua groote, dus is het geen probleem om vanaf het begin 1 datafile in te laden voor alle pagina, enkel per pagina verschillende data aan te spreken.

eventueel kan je ook wat dieper gaan en al in je array bepaalde waardes als key te gebruiken, datetime variabelen zijn daarvoor prima en maken eenvoudige sorteringen mogelijk, ook de naam van de poster kun je eventueel als key zelf gebruiken, zodat je deze er zelf uit kunt vissen.

als het geheel nog dieper gaat, moet je je serieus afvragen waarom je geen serverside gegenereerde methodiek zou willen/kunnen toepassen, immers, daarbij is de foutmarge kleiner, en het onderhoud gebruikersvriendelijker

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen


  • Rigi
  • Registratie: September 2001
  • Laatst online: 30-11-2018
als ik het goed begrijp wil je dus een aparte .js maken met alleen entries. en die dan includen in het script deel??

maar dan heb ik toch nog steeds tig aparte sciptdelen nodig die allemaal een andere datafile inlezen??

en ik gebruik geen serverside omdat mijn server dat zover ik weet niet toestaat *(shtml # includes worden bv. niet gedaan)