TRImax

CRUD

CRUD is een letterwoord dat staat voor de vier basisbewerkingen op een databasetabel:

Create (nieuwe gegevens toevoegen in een nieuwe rij in de databasetabel)
Read (een lijst tonen van gegevens in tabelvorm)
Update (gegevens aanpassen van een rij in de databasetabel)
Delete (een rij met bestaande gegevens verwijderen uit de databasetabel)

CRUD is volledig geïntegreerd in TRImax. Met CRUD kan de content van een tabel beheerd worden die in een MOD gebruikt wordt om herhalende gegevens op de website te presenteren.Het volstaat om in config.php in $config["crud"] de metagegevens van de tabel en de kolommen te definiëren.

Om de designer toe te laten de stijl van de invulformulieren te kunnen aanpassen, worden blokjes html opgenomen in de metadata die het invulveld beschrijven.

voorbeeld CRUD op website van TRIOS

$config["crud"]

Er zijn twee soorten metagegevens

algemene structuur van de lijst en het invulformulier
details per kolom

algemeen: $config["crud"]["tabelnaam"]["=TABLE="]["metaparameter”] = "waarde";
algemeen: $config["crud"]["tabelnaam"]["kolomnaam"]["metaparameter”] = "waarde";

algemene opmaak lijst en formulier

DIVTABLECLASS: de containerclass voor de volledige tabel met de gegevens in lijstvorm (R van CRUD)
TABLECLASS: de class van de table met de gegevens in lijstvorm
DIVFORMCLASS: de containerclass voor het volledige invulformulier met de bewerkingen Create, Update, Delete
FORMCLASS: de class van de form met het volledige invulformulier
TRTHCLASS: class van de individuele titels boven elke kolom van de tabel 1
TRTDCLASS: class van de individuele kolommen met gegevens 2
READTITLE: tekst of icon boven create-update-delete formulier, om terug te keren naar de tabel
CREATETITLE: tekst van de Create-functie (meestal een icon) 3
UPDATECOLTITLE: titel boven de Update-kolom 4
UPDATECOLTD: tekst of icon van de Update-functie 5
DELETECOLTITLE: titel boven de Delete-kolom 6
DELETECOLTD: tekst of icon van de Delete-functie 7
SORT : optioneel, mag leeg blijven, sortering van de lijst (READ), dit kan één enkel veld zijn of een lijst van velden gescheiden door komma's; het gedeelte van de SQL-query na de SORT BY
(nog niet geïmplementeerd) FILTER : optioneel, mag leeg blijven, het gedeelte van de SQL-query na de WHERE
(nog niet geïmplementeerd) PAGING : een cijfer dat aangeeft hoeveel rijen uit de tabel in de lijst getoond mogen worden; activeert ook de paging onderaan de tabel

voorbeeld

$config["crud"]["applicusers"]["=TABLE="]=array(
"DIVTABLECLASS"=>"",
"TABLECLASS"=>"tablecrud",
"DIVFORMCLASS"=>"table-wrapper crudtable",
"FORMCLASS"=>"",
"TRTHCLASS"=>"trthclass",
"TRTDCLASS"=>"trtdclass",
"READTITLE"=>"<i class='icon icon-table' style='font-size: 2.5em; padding-right: 1em;'></i>",
"CREATETITLE"=>"<i class='icon icon-plus-sign' style='font-size: 2.5em; padding-right: 1em;'></i>",
"UPDATECOLTITLE"=>"upd",
"UPDATECOLTD"=>"<i class='icon icon-pencil'></i>",
"DELETECOLTITLE"=>"del",
"DELETECOLTD"=>"<i class='icon icon-trash'></i>",
"SORT"=>"familienaam,voornaam",
"FILTER"=>"",
"PAGING"=>""
);

kolommen in de lijst en velden in het invulformulier

Elke kolom van de databasetabel heeft een aantal metadata voor de lijst (LIST) en voor het formulier (FORM).

LIST

LISTORDER: de volgorde in de lijst, 1 = eerste kolom; speciaal geval: 0 = deze kolom niet tonen
LISTTITLE: de titel boven de kolom
LISTALIGN: align van de titel boven de kolom [ left | right ]
LISTWIDTH: bij voorkeur uitdrukken in percentage omwille van responsive design; er moet minstens 1 flexkolom zijn ZONDER waarde

FORM

FORMORDER: de volgorde in het formulier, 1 = eerste veld: speciaal geval: 0 = dit veld niet opnemen in het formulier (vb. id)
FORMLABEL: het label boven het invulveld
FORMTYPE: het type, volgens de html-norm, één van de zes mogelijke input-types: [ text | textarea | select | radio | checklist |submit ]
FORMREQUIRED: 1=input is verplicht, een leeg veld is niet toegelaten // 0 = niet verplichte invoer; wordt aangegeven met een klein cirkeltje naast het label in het invulformulier
FORMHTML: de html-code om dit formelement te presenteren, met een aantal verplichte placeholders; zie verder voor meer uitleg en voorbeelden

verplichte placeholders in FORMHTML

name='#dbtable_#fieldname'
id='#dbtable_#fieldname'
value='#fieldvalue'

optionele placeholder in FORMHTML

#fieldlist

FIELDLIST

dit is een optioneel veld
wordt enkel gebruikt bij type=(select, radio, checkbox)
de lijst is gedefinieerd als een verzameling van paren (key,label) waarbij de eerste waarde de key is die zal opgeslagen worden in de databasetabel en de tweede waarde die op scherm verschijnt in de CRUD.

Er zijn drie mogelijkheden om de FIELDLIST samen te stellen:

via een SQL-query
via een Airtable-query (de documentatie hiervoor zal nog aanvuld worden)
via een vaste lijst

De FIELDLIST laat toe relationele gegevens via een query uit de database op te halen, indien de waarden van de (select, radio, checkbox) zich bevinden in een andere tabel.

SQL-query

voorbeeld: "FIELDLIST"=>"SELECT artnr,artomschrijving FROM artikels ORDER BY volgorde",

Airtable query

wordt later aangevuld

JSON vaste lijst

Het is ook mogelijk een vaste lijst met waarden op te geven, als een JSON-lijst. Een JSON-lijst start met een { en eindigt met een }; de paren worden gedefinieerd met dubbel quotes (verplichte JSON-standaard) en een dubbel punt als volgt:

"key":"label"

voorbeeld: "FIELDLIST"=>'{"M":"man","V":"vrouw","X":"anders"}',

voorbeeld

$config["crud"]["applicusers"]["familienaam"]=array(
"LISTORDER"=>1,
"LISTTITLE"=>"familienaam",
"LISTALIGN"=>"",
"LISTWIDTH"=>"30%",
"FORMORDER"=>1,
"FORMLABEL"=>"familienaam",
"FORMTYPE"=>"text",
"FORMREQUIRED"=>1,
"FORMHTML"=>"
    <div class='form-group'>
    <input type='text' name='#dbtable_#fieldname' id='#dbtable_#fieldname' value='#fieldvalue' placeholder='...' class='form-control' />  
    </div>
");

voorbeelden HTML en FIELDLIST

Er zijn zes types input die in CRUD kunnen gebruikt worden:

text
textarea
select
radio
checklist
submit

Hieronder enkele voorbeelden van html-code voor elk van deze types; het is de bedoeling dat de designer de customclass vervangt door een relevante class uit zijn css-classes.

text

"HTML"=>"
<div class='customclass'>  
    <input type='text' name='#dbtable_#fieldname' id='#dbtable_#fieldname' value='#fieldvalue' placeholder='...' />  
</div>
",

htmlarea

"HTML"=>"
<div class='customclass'>
    <textarea name='#dbtable_#fieldname' id='#dbtable_#fieldname' rows='6' placeholder='...'>#fieldvalue
</div>
",

select

"HTML"=>"
<div class='customclass'>
    <div class='select-wrapper'>
        <select name='#dbtable_#fieldname' id='#dbtable_#fieldname'>
        #fieldlist
        </select>
    </div>
</div>
",
"FIELDLIST"=>"SELECT volgorde,volgorde AS volgordeval FROM triosprojecten ORDER BY volgorde",
*OR* "FIELDLIST"=>'{"1":"TRImax 1","2":"TRImax 2","3":"TRImax 3","9":"maatwerk"}',

radio

"HTML"=>"
<div class='customclass'>
    <input type='radio' name='#dbtable_#fieldname' id='#dbtable_#fieldname_#fieldvalue' value='#fieldvalue' #checked>
    <label for='#dbtable_#fieldname_#fieldvalue'>#fieldlabel</label>
</div>
",              
"FIELDLIST"=>"SELECT volgorde,volgorde AS volgordeval FROM triosprojecten ORDER BY volgorde",
*OR* "FIELDLIST"=>'{"1":"TRImax 1","2":"TRImax 2","3":"TRImax 3","9":"maatwerk"}',

checklist

"HTML"=>"
<div class='customclass'>
    <input type='checkbox' name='#dbtable_#fieldname[]' id='#dbtable_#fieldname_#fieldvalue' value='#fieldvalue' #checked>
    <label for='#dbtable_#fieldname_#fieldvalue'>#fieldlabel</label>
</div>
",              
"FIELDLIST"=>"SELECT volgorde,volgorde AS volgordeval FROM triosprojecten ORDER BY volgorde",
*OR* "FIELDLIST"=>'{"1":"TRImax 1","2":"TRImax 2","3":"TRImax 3","9":"maatwerk"}',

submit

"HTML"=>"
<div class='customclass'>
    <input type='submit' value='#fieldvalue' class='special' />
</div>
",

TRImax documentatie