FormCreator Class
Beste allemaal,
Ik heb eindelijk mijn eerste (werkende!) class kunnen maken. Werd tijd :-P. Ben er dus ook super trots op, al stelt het voor de meesten van jullie natuurlijk weinig voor.
Ik wilde aan jullie vragen of jullie nog tips/verbeteringen/opmerkingen/aanmerkingen/commentaar/kritiekpuntjes hadden en of jullie zo vriendelijk willen zijn deze te melden. Al zal dat kritiek niet zo moeilijk zijn tegenwoordig, haha :-P.
(Geef overigens ook even je mening over de lay-out van mijn geweldige scriptlib, zelf via htaccess enzo gemaakt :-P.)
http://www.dzjemo.nl/phphulp/formcreator.php
Ik hoor het wel!
Jezpur
Ik heb eindelijk mijn eerste (werkende!) class kunnen maken. Werd tijd :-P. Ben er dus ook super trots op, al stelt het voor de meesten van jullie natuurlijk weinig voor.
Ik wilde aan jullie vragen of jullie nog tips/verbeteringen/opmerkingen/aanmerkingen/commentaar/kritiekpuntjes hadden en of jullie zo vriendelijk willen zijn deze te melden. Al zal dat kritiek niet zo moeilijk zijn tegenwoordig, haha :-P.
(Geef overigens ook even je mening over de lay-out van mijn geweldige scriptlib, zelf via htaccess enzo gemaakt :-P.)
http://www.dzjemo.nl/phphulp/formcreator.php
Ik hoor het wel!
Jezpur
Gesponsorde koppelingen:
Hmm, ik wil het niet afkraken, maar misschien klinkt het wel zo. Maar goed daar gaat ie:
* Ik zie HTML code in de class. Niet zo zeer de option en de verschillende form elementen, maar de table om alles netjes te krijgen. Laat dat aan de designer over. Tegenwoordig worden vooral divs, spans, labels en misschien ook wel lists gebruikt om een formulier te stylen.
* Extra attributen zoals style e.d. kunnen niet toegevoegd worden aan een form element. Het doel die je voor ogen had als zijnde flexibel formulier maker is eigenlijk verdwenen. Je zit vast aan de standaarden van de class, en daar moet je het mee doen. Wat als je een custom JavaScript script hebt, en je wilt een element aanspreken met de attribute 'rel'? Dat kan nu niet.
Desalniettemin heeft deze class ook voordelen voor de gemiddelde programmeur/designer. In één oogopslag is het formulier te zien en in een luttele seconden kan je een formulier samenstellen.
Ik hoop dat je er wat mee kunt.
EDIT: Ik ben erg gecharmeerd van het Prado framework. Daar hebben ze ook custom HTML formulier classes. Een voorbeeldje:
En dat wordt dan omgezet in valid (X)HTML, zodat de designer het af kan handelen met zoals je al een beetje ziet CSS styling.
* Ik zie HTML code in de class. Niet zo zeer de option en de verschillende form elementen, maar de table om alles netjes te krijgen. Laat dat aan de designer over. Tegenwoordig worden vooral divs, spans, labels en misschien ook wel lists gebruikt om een formulier te stylen.
* Extra attributen zoals style e.d. kunnen niet toegevoegd worden aan een form element. Het doel die je voor ogen had als zijnde flexibel formulier maker is eigenlijk verdwenen. Je zit vast aan de standaarden van de class, en daar moet je het mee doen. Wat als je een custom JavaScript script hebt, en je wilt een element aanspreken met de attribute 'rel'? Dat kan nu niet.
Desalniettemin heeft deze class ook voordelen voor de gemiddelde programmeur/designer. In één oogopslag is het formulier te zien en in een luttele seconden kan je een formulier samenstellen.
Ik hoop dat je er wat mee kunt.
EDIT: Ik ben erg gecharmeerd van het Prado framework. Daar hebben ze ook custom HTML formulier classes. Een voorbeeldje:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<com:TLabel
ForControl="Username"
Text="Username" /><br />
<com:TTextBox
ID="Username"
CssClass="text" /><br />
<!-- En nog een aantal ingebouwde validator dingen -->
<com:TLabel
ForControl="Password"
Text="Password" /><br />
<com:TTextBox
ID="Password"
TextMode="Password"
CssClass="text" />
<!-- En nog een aantal ingebouwde validator dingen -->
<com:TLabel
ForControl="Email"
Text="Email Address" /><br />
<com:TTextBox
ID="Email"
CssClass="text" />
<!-- En nog een aantal ingebouwde validator dingen -->
ForControl="Username"
Text="Username" /><br />
<com:TTextBox
ID="Username"
CssClass="text" /><br />
<!-- En nog een aantal ingebouwde validator dingen -->
<com:TLabel
ForControl="Password"
Text="Password" /><br />
<com:TTextBox
ID="Password"
TextMode="Password"
CssClass="text" />
<!-- En nog een aantal ingebouwde validator dingen -->
<com:TLabel
ForControl="Email"
Text="Email Address" /><br />
<com:TTextBox
ID="Email"
CssClass="text" />
<!-- En nog een aantal ingebouwde validator dingen -->
En dat wordt dan omgezet in valid (X)HTML, zodat de designer het af kan handelen met zoals je al een beetje ziet CSS styling.
Gewijzigd op 01/01/1970 01:00:00 door GaMer B
Ja met die HTML code zat ik dus ook mee. Want als je zo'n formulier eenmaal hebt samengesteld, hoe wil je het dan nog opmaken? Dat kan men vooraf dan in de class aanpassen, maar dan is het doel om simpel een formulier samen te kunnen stellen ook gelijk verdwenen, inderdaad.
Ik zit misschien een beetje in de lucht te grijpen als je style attributen wil toevoegen, ik doelde meer op id="" enzo. Die style daar is meer een extra voorbeeldje. Je kunt net zo goed als extra iets met rel opgeven. Hoeft niet per se die id en style te zijn, dat was meer een voorbeeld.
Ik zit misschien een beetje in de lucht te grijpen als je style attributen wil toevoegen, ik doelde meer op id="" enzo. Die style daar is meer een extra voorbeeldje. Je kunt net zo goed als extra iets met rel opgeven. Hoeft niet per se die id en style te zijn, dat was meer een voorbeeld.
Gewijzigd op 01/01/1970 01:00:00 door Jesper Diovo
Misschien is het een idee om wat classes door te kijken die al zo'n soort dingen doen. En een beetje ideeën opdoen. Eerlijk gezegd weet ik bij god niet hoe ze dat doen. Wat je WEL kan doen is zoiets:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<?php
$formulier = new Formulier('test'); // name is dan test
$formulier->addElement('text', 'een value', $array(
'attribute' => 'waarde',
'attribute2' => 'waarde',
));[/code]
(Beetje afgekeken van Zend (dacht ik) :P
$formulier = new Formulier('test'); // name is dan test
$formulier->addElement('text', 'een value', $array(
'attribute' => 'waarde',
'attribute2' => 'waarde',
));[/code]
(Beetje afgekeken van Zend (dacht ik) :P
Gewijzigd op 01/01/1970 01:00:00 door GaMer B
Oh zo. Ja dat zou nog kunnen, ja. Hm. Maakt het wel al weer iets 'mooier'.
Kijkt u maar eens ;-).
Kijkt u maar eens ;-).
Gewijzigd op 01/01/1970 01:00:00 door Jesper Diovo
Kijk anders eens naar Zend_Form, dat is een onderdeel van het Zend Framework waar ik wel gecharmeerd van ben.
Da's wel erg uitgebreid, hoor :-P. Zo ver was ik nou ook weer niet van plan te gaan, haha.
Is al beter. Ik hoop dat je ook de flexibiliteit "voelt" ? :P
Alleen het probleem van stylen nog oplossen. Die table moet er uit.
Alleen het probleem van stylen nog oplossen. Die table moet er uit.
Klopt. Ik zat te denken om de velden en zo in een array terug te geven, zodat men zelf daaromheen kan bouwen. Maar dan zit je ook weer met de form-tag die dan alsnog zelf geschreven moet worden.
Bijv.
'k Heb nu maar iets gedaan, werk nooit met labels dus weet niet of dat goed is :-P.
Bijv.
Code (php)
'k Heb nu maar iets gedaan, werk nooit met labels dus weet niet of dat goed is :-P.
Overigens wat ik me nu bedenk: Het genereren van een formulier is nog niet eens het meeste werk. Het valideren daarvan is echter wel vreselijk werk. Als je DAT erin kunt verwerken zou het nog beter zijn. Tip: Gebruik regels zoals:
$username->addValidator('required');
$username->addValidator('regex', '[\w]{3,50}');
Jouw concept dingetje is niet echt geweldig overigens. Dan leg je weer teveel werk bij de programmeur en niet zozeer bij de designer.
Nog een ideetje: Wat nou als je de wrapper variabel maakt? Dat je zoiets kun instellen:
$form->setWrapper(array('<table>', '</table>'));
$form->setWrapperRow(array('<tr>', '</tr>'));
$form->setWrapperColumn(array('<td>', '</td>'));
Misschien een ideetje.
$username->addValidator('required');
$username->addValidator('regex', '[\w]{3,50}');
Jouw concept dingetje is niet echt geweldig overigens. Dan leg je weer teveel werk bij de programmeur en niet zozeer bij de designer.
Nog een ideetje: Wat nou als je de wrapper variabel maakt? Dat je zoiets kun instellen:
$form->setWrapper(array('<table>', '</table>'));
$form->setWrapperRow(array('<tr>', '</tr>'));
$form->setWrapperColumn(array('<td>', '</td>'));
Misschien een ideetje.
Dat Wrapper is wel een goed plan op zich. Alleen, moet ik dan bij Column om beiden (tekst en veld) die twee tags zetten? Lijkt me namelijk niet :-P.
Klopt dat het eigenlijk niet echt geweldig is. Maar het gaat me meer om het OOP gedeelte en of de logica zo een beetje klopt. Ik vind OOP echt geweldig en als ik het zelf goed kan zou dat helemaal top zijn. Maar op dit moment ben ik alleen maar dingetjes aan het uitproberen.
Klopt dat het eigenlijk niet echt geweldig is. Maar het gaat me meer om het OOP gedeelte en of de logica zo een beetje klopt. Ik vind OOP echt geweldig en als ik het zelf goed kan zou dat helemaal top zijn. Maar op dit moment ben ik alleen maar dingetjes aan het uitproberen.
Juist als je OOP zo geweldig vindt is het leuk om eens de richting op te gaan van Zend_Form: Voor ieder element een eigen class. Op die manier kan je logica die specifiek voor select of input[type=radio] is in hun eigen class houden, en kan je nieuwe (of hergebruikte, maar opnieuw opgemaakte) form-elementen toevoegen zonder classes te hoeven veranderen. Iets a la:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<?php
class Form
- addField(Field $field)
- draw()
abstract class Field
- setValue()
- setAttribute()
- draw() (wordt aangeroepen door Form::draw)
class TextField extends Field
- setPlaceholder($text)
- draw() (overschrijven, zodat je specifiek input[type=text] kan teruggeven)
$x = new Form;
$naam = new TextField('Voornaam');
$naam->setPlaceholder('Vul hier je voornaam in');
// dit kan je ook onderbrengen in de class zelf
if(isset($_POST['naam']))
$naam->setValue($_POST['naam']);
$x->addField($naam);
$x->draw();
?>
class Form
- addField(Field $field)
- draw()
abstract class Field
- setValue()
- setAttribute()
- draw() (wordt aangeroepen door Form::draw)
class TextField extends Field
- setPlaceholder($text)
- draw() (overschrijven, zodat je specifiek input[type=text] kan teruggeven)
$x = new Form;
$naam = new TextField('Voornaam');
$naam->setPlaceholder('Vul hier je voornaam in');
// dit kan je ook onderbrengen in de class zelf
if(isset($_POST['naam']))
$naam->setValue($_POST['naam']);
$x->addField($naam);
$x->draw();
?>
Hm.. Ja, Zend is me wat. Heb het hele zooitje op m'n pc staan omdat ik Zend_Db gebruik bij een van m'n websites, daar ondersteunde men nog geen PDO.... Nja, dat terzijde: ik zal eens de documentatie van Zend_Form door gaan nemen, misschien dat ik dat dan voortaan wel ga gebruiken om een formulier te maken :-).
Naja, je hoeft niet specifiek Zend_Form te bekijken, je kan ook kijken naar FormHandler of een ander "groot" form-hulpje-script-ding-achtig-iets. Ik denk dat ze allemaal wel op zo'n soort manier met meerdere classes, en classes specifiek voor bepaalde elementen zullen werken.
Maar is het niet de hele bedoeling van OOP dat al je gegevens die je opslaat, een soort object word.
Dus je krijgt bijvoorbeeld een abstracte class met input o.i.d.
Die geef je bepaalde methodes en variablen mee, die voor iedere class verplicht zijn, en dan maak je dus allemaal overerfende classes voor een textfield enzo.
En dat je dan een class form heeft, waarmee je het hele form kan gaan bouwen.
(dus eigenlijk wat in Jelmer z'n voorbeeld code staat )
Dus je krijgt bijvoorbeeld een abstracte class met input o.i.d.
Die geef je bepaalde methodes en variablen mee, die voor iedere class verplicht zijn, en dan maak je dus allemaal overerfende classes voor een textfield enzo.
En dat je dan een class form heeft, waarmee je het hele form kan gaan bouwen.
(dus eigenlijk wat in Jelmer z'n voorbeeld code staat )
Ik mis het spannendste gedeelte namelijk het controleren van de gegevens en het wegschrijven naar DB of email
Wat verbeterpunten van je class:
- haal de echo uit outputForm(). Return gewoon het resultaat.
- probeer de velden op te bouwen door middel van DOM. Hierdoor is het makkelijk om attributen / waardes toe te voegen. Bovendien verkleint dit de kans op fouten én is het XHTML valid.
Ikzelf heb (naast een soortgelijke implementatie als Jelmer geeft) nog methodes addValidator en addFilter, die je op de velden kan loslaten. Als elke validator succesvol valideert is het formulier correct.
Je zou eventueel een onComplete methode kunnen toevoegen, die een actie (callback) doet als het formulier correct is (zoals het wegschrijven naar een DB).
Daarnaast, als je het helemaal doorvoert (MVC-achtig), is het wellicht logisch om een View object te retourneren als je draw() aanroept. Ikzelf twijfel nog hoe ik dat in mijn eigen formulierklasse kan / ga implementeren.
Een goede formulierklasse is ingewikkelder dan je denkt, maar ook een mooie uitdaging! Leesvoer.
- haal de echo uit outputForm(). Return gewoon het resultaat.
- probeer de velden op te bouwen door middel van DOM. Hierdoor is het makkelijk om attributen / waardes toe te voegen. Bovendien verkleint dit de kans op fouten én is het XHTML valid.
Ikzelf heb (naast een soortgelijke implementatie als Jelmer geeft) nog methodes addValidator en addFilter, die je op de velden kan loslaten. Als elke validator succesvol valideert is het formulier correct.
Je zou eventueel een onComplete methode kunnen toevoegen, die een actie (callback) doet als het formulier correct is (zoals het wegschrijven naar een DB).
Daarnaast, als je het helemaal doorvoert (MVC-achtig), is het wellicht logisch om een View object te retourneren als je draw() aanroept. Ikzelf twijfel nog hoe ik dat in mijn eigen formulierklasse kan / ga implementeren.
Een goede formulierklasse is ingewikkelder dan je denkt, maar ook een mooie uitdaging! Leesvoer.
Gewijzigd op 01/01/1970 01:00:00 door Mark PHP
Ik ben toevallig ook bezig aan een form class.
Ik probeer nu ook te zorgen dat ik events kan toevoegen (onClick, onChange, ...); dat, buiten de html van het formulier, ook een insert string wordt gebouwd met de juiste velden, met de $_POST ingewerkt; dat de juiste waarden in javascript worden gelezen en doorgegeven aan een functie die alles met Ajax opstuurt.
Het begint mooi te werken, maar er is nog een hoop werk aan.
Ik probeer nu ook te zorgen dat ik events kan toevoegen (onClick, onChange, ...); dat, buiten de html van het formulier, ook een insert string wordt gebouwd met de juiste velden, met de $_POST ingewerkt; dat de juiste waarden in javascript worden gelezen en doorgegeven aan een functie die alles met Ajax opstuurt.
Het begint mooi te werken, maar er is nog een hoop werk aan.
als je het helemaal mooi wilt doen moet je de form kunnen bouwen aan de hand van de eigenschappen van de in een SQL statement gevraagde columns
Hm, ik denk dat ik hem nog wel ietsjes ga uitbouwen. In ieder geval een validatie er op :-).
Klaasjan Boven schreef op 30.04.2009 11:16:
als je het helemaal mooi wilt doen moet je de form kunnen bouwen aan de hand van de eigenschappen van de in een SQL statement gevraagde columns
Uhm, ik doe zo ongeveer het omgekeerde, maar je hebt wel een punt.
Met een sql dump, waar de CREATE TABLE op staat, moet dat wel lukken.
Gewijzigd op 01/01/1970 01:00:00 door Emmanuel Delay



