Voorbeeld bestanden
Onderstaande voorbeelden zijn bedoeld om een indicatie te geven hoe je de webservices en Javascript Library kunt gebruiken.
Let op:
Voor het bekijken van onderstaande voorbeelden dien je in het bezit te zijn van de ClientID van de vereniging.
In de bestanden staat: clientId: "xxxxxxx". Hierbij dien je de xxxxxxx te vervangen door de eigen ClientID.
Let op:
Je dient alle bestanden bij een bepaalde demo te downloaden en in dezelfde map te plaatsen om deze te laten werken. Downloaden doe je door de koppeling met de rechtermuisknop aan te klikken en te kiezen voor Link opslaan als... of Koppeling opslaan als...
Type demo | Bestand |
---|---|
Demo met logo en programma | demo logo en programma.html |
Demo met css | demo met css.html table.css |
Demo met team-indeling | demo met team-indeling.html team-indeling.html |
Deze voorbeeld opmaak toont de tabel uitslagen met een grijze kopregel.
De stijldefinitie plaats je in de header van de webpagina:
<style> .grijs table { border-collapse: collapse; text-align: left; font-weight: bold; font-family: arial; font-size: 12px; color: #444444; } .grijs th { background-color: #cccccc; border: 1px solid #444444; padding-top: 0px; padding-right: 2px; padding-bottom: 0px; padding-left: 2px; } .grijs td { border: 1px solid #444444; padding-top: 0px; padding-right: 2px; padding-bottom: 0px; padding-left: 2px; } .grijs td:nth-child(1) { text-align: right; } </style>
In de door de Javascript Library gegenereerde html-code geef je aan dat de div de klasse "grijs" moet gebruiken:
<div class="grijs" data-article="uitslagen" data-param-gebruiklokaleteamgegevens="NEE" data-label-wedstrijdnummer="Nummer" data-label-datumopgemaakt="Datum" data-fields="wedstrijdnummer,datumopgemaakt,wedstrijd,uitslag" ></div>
In een artikel waarin naast informatie over een team van je eigen vereniging ook informatie over teams van andere verenigingen wordt getoond (uitslagen, standen of programma) kun je de regel waarin je eigen team vermeld wordt een aparte opmaak geven. Hiervoor moet je dan een css-klasse definiëren als volgt:
.datagrid table tbody tr.Own td { color: red; }