ConvetionalRenderer – Latte pomocník pro ruční renderování formuláře + Tw Bootstrap

Super, konečně to někdo napsal :)

Vypadá to hezky, ale často potřebuju spíš vykreslit jinak celý Forms\Container. Předpokládám že to asi vyřešené nemáš? Kdysi jsem se o něco takového pokoušel, ale uspal jsem to společně s projektem, ve kterém jsem to vyvíjel…

Editoval norbe (14. 3. 2012 11:03)

Tak, původně jsem chtěl kód uveřejnit až po refaktoringu, nicméně alespoň získáme čas na diskuzi o tom, jak to nakonec ideálně udělat. Rád bych předeslal, že se Twitter Bootstrap formulářům budu věnovat do neděle 22. 4., čili rád implementuju cokoliv, na čem se zde domluvíme :-)

Současný kód je zde . Jedná se o prasárnu, napsanou za včerejší odpoledne! (a už jsem si dal facku za uveřejnění)

V podstatě to skládá .latte soubory za sebe stejně, jako to dělal původní ConventionalRenderer. Přemýšlel jsem, které řešení je lepší:

• rvát vše do jednoho master.latte souboru je wtf
• přetěžovat renderování za pomocí {include} je znásilnění
• skládat stuby za sebe, tak jak to dělám já, je taky wtf (a hlavně princip, který se používal 7 let zpátky.)

Navrhuji (a budu na tom teď dělat) to, aby byl jeden master.latte soubor, který by vypadal nějak takto a takto . Jsou to kódy použité v test suite JSONRpcv2, nicméně stejný princip bych zachoval i v refaktoringu.

Řešení, které mi osobně přijde nejlepší, se vyznačuje následujícím:

• možnost přetížit hlavní master.latte, který includuje svoje stuby, například $form->setRenderer(new TemplateFormRenderer(APP_DIR . '/templates/myforms.latte'));
• možnost přetížit jednotlivé fieldy: $form->addText(..)->setOption('templateOverride', APP_DIR . '/templates/mytexbox.latte')
• vlastní renderer – tzn. když chci udělat bootstrap-enabled formy, prostě přidám $form->setRenderer(new TemplateFormRenderer());

Důvod, proč chci přetěžovat jednotlivé fieldy na úrovni Options je ten, že spoustu věcí (jako například latitude/lognitude control) můžu udělat za pomocí .latte a JS – nemusím tedy dělat tenhle a tenhle bordel. Navíc nemusím vyrábět z Nette\Forms → Moje\forms. To samé platí pro různé WYSIWYG editory atp.

V podstatě bych pro gmapu mohl udělat: $form->addHidden('map')->setOption('templateOverride', 'templates/forms/googlemap.latte'); – stejně si obslužné javascripty tak jako tak musíme napsat sami, nevidím jediný důvod, proč to jinak nedělat.

Ad vlastní renderer: osobně bych byl pro to, aby se z toho bordelu, co tam teď mám, stalo něco, co předžvejká form pro šablonu tak, aby se v tom v šablonách dobře pracovalo. Jde například o placeholders, helpy, serializování checkboxů, různé options etc. Renderer by tedy vygeneroval stdclasses s předem danou strukturou, ze kterých by se vytvořil formulář. Výhoda je navíc ta, že jenom do components/ dropnu celou složku, u formu přidám jeden řádek, a mám hotovo.

A teď co to umí:

• helpy u jednotlivých fieldů
• warningy u jednotlivých fieldů ve chvíli, kdy jsou špatná data (zde, a po submitu zde)
• chyby, které jsou u fieldu, se nezobrazují nahoře ve formu (u složitých formů výhoda)
• díky rendereru umí vytvářet formy za pomocí {control myForm}

• následující:

<?php
$field->setOption('help', 'help text');
$field->setOption('status', 'warning|error|success'); // the style of the field
$field->setOption('class', 'someclasses');
$field->setOption('prepend', 'prepend text within input');
$field->setOption('append', 'append text within input');
$field->setOption('prepend-button', 'buttonid');
$field->setOption('append-button', 'buttonid');
$field->setOption('placeholder', 'this is some placeholder text');
?>

Jdu refaktorovat, nahoďte mi Váš názor. Až bude updatnutý github, dám vědět :-)

forkuj, uvidíme co z toho vyleze :-) Právě pracuju na tom, co jsem naznačil, uvidíme, čí řešení se ujme víc :-)

Nicméně si stále stojím za tímto:

možnost přetížit jednotlivé fieldy: $form->addText(..)->setOption(‚templateOverride‘, APP_DIR . ‚/templates/mytexbox.latte‘)

Tak, nahodil jsem na GH novou verzi (a zapomenul branchovat.) Každopádně, co jsem měl na mysli já je teď vidět zde a hlavně v master.latte souboru

Teď bych už jenom předělal jednotlivé .latte files tak, aby to vypadalo lépe – skládat html dohromady z pěti variables je nechutné, použití {input} je krásné.

@hosiplan: osobně bych zkombinoval moje phpko a tvoji šablonu, dej vědět až budeš mít pushnuto do forku.

Kluci nechcete udělat DefaultTemplateFormRedener? Který by vyplivnul stejný výsledek jako aktualní DefaultFormRenderer? A poslat to jako pull do nette? :-)

Samozřejmě :)

Ähoj, tak jsem to zkusil a vyhazuje to následující noticku:

Notice
Undefined variable: _control
…
…
BootStrapRenderer.php
…
110: $this->template->render();

Nějak jsem se svépomocí nedopracoval k tomu, kde by mohl být problém…(PHP 5.3.10, Nette 2.0.1, Apache 2.2.21 – vše x64)

potapnik napsal(a):
Undefined variable: _control

Nějak jsem se svépomocí nedopracoval k tomu, kde by mohl být problém…(PHP 5.3.10, Nette 2.0.1, Apache 2.2.21 – vše x64)

Aktualizuj na Nette 2.02 nebo vyšší.

Myslím, že od té doby už není nutné mít $_control, pokud $form je instance Form. Dříve se to snažilo najít komponentu s názvem $form v kontejneru $_control.
Jinak pokud bys předával do šablony $form jako string obsahující název komponenty, tak je stále nutné předat i $_control, ve kterém bude nadřazený kontejner (typicky presenter).

Editoval Šaman (24. 4. 2012 0:08)

Tak já mám také hotovo :) zde

Proč: Protože jsem nerozumněl hosiplanově šabloně.
Proč 2: Protože renderer by imho neměl manipulovat s Html:: → nechť se toto děje v šablonách

Každopádně jsem si pár věcí od Hosiplana zkopnul, není to špatně napsané ;)

edit: Ad vlastní fields: (psáno specielně pro vrtáka ;))

1. Vyrobte si vlastní šablonu v projektu / nelle / kdyby – třeba "@form.latte" a naplňte ji takto:

{layout '../components/Nestraps/bootstrap.latte'}
{define #WYSIWYG}<nejakej markup>{/define}

2. Vyrobte field class WYSIWYG extends ... {}
3. ???
4. $form->addWYSIWYG(...)
5. $form->setRenderer(new foglcz\NestrapRenderer(__DIR__ . '/../templates/@form.latte', $this->context->cacheStorage))

Editoval ptacek.pavel (24. 4. 2012 7:43)

Chlapi, jak jste na tom s rychlostí renderování? Když jsem si tohle napsal asi před dvěma třemi roky (někde tady na fóru to určitě ještě bude), tak jsem narazil na to, že to bylo řádově (cca 10×) pomalejší než ConventionalRenderer. Bylo to tím, že to zpracování šablon v takovém množství prostě chvíli trvá. Dělali jste teď nějaké porovnání podle rychlosti?

Editoval arron (24. 4. 2012 13:42)

Jo, nakonec jsem dospěl k tomu samému :-)

viz https://forum.nette.org/…tw-bootstrap#…

Menší cyhbička:

<?php
--- b6527da68175b7847b1c8896ea79e58143827769
+++ e0be77dfd10404b993bf2b853438c99d8bda880a
@@ -90,7 +90,7 @@
 			}

 			$formEl = $form->getElementPrototype();
-			if (stripos('form-', $formEl->class) === FALSE) {
+			if (stripos($formEl->class, 'form-') === FALSE) {
 				$formEl->addClass('form-horizontal');
 			}
 		}
?>

Můžu prosím nějak i při použití tohoto rozšíření nastavit wrappers?

Jako dříve např:

$renderer->wrappers['pair']['container'] = 'p';

Ahoj, chtěl bych se zeptat, kde bych mohl sehnat nějaký příklad použití? Vůbec mě nenapadá, jak má vypadat ta hierarchie šablon a presenter..
Díky moc

Hosiplan:

je nějaký důvod proč se pro checkbox label renderuje
$control->label->getText()
a ne
$control->label

?
potřeboval jsem dát do popisky odkaz …

Editoval LeonardoCA (30. 8. 2012 14:47)

dik za renderer, kresli fajn :) daju sa ale prepisovat inputy tak ze jeden z nich rucne vykreslim a zvysok formu sa vykresli samo? makro {define} uz je opravene, akurat podla toho prikladu mi to nechce fungovat.

Editoval rixi (31. 8. 2012 10:35)

Vydána verze 0.9.1, která opravuje několik chyb.

Je potreba nova verze tridy Nette\Iterators\Filter. Doporucuju updatnout tridy Filter, Mapper i RecursiveFilter.

Editoval Elijen (9. 9. 2012 21:23)

Dobry den

ano ted to jiz funguje bezvadne

dekuji

Vypadá to skvěle! Díky :) Jen tag 0.9.2 neobsahuje složky DI a Latte, takže s composer instalací je člověk nedostane, musí na github… Stáhnu manuálně a jdu testovat :)

Jasné, hodil bych ale o tom zatím zmínku do doplňků , tam to vypadá jako aktuální feature.

implemenovat by sa dalo kadeco, pripadne nastavit standardne aby sa vsetkym input/select prvkom nastavovala nejaka class span*, potom tak funguju formularove prvky dobre aj v responsive bootstrapu.

@Hosiplan: Máš pravdu ten <div> to tam kazí. Díky, tvoje řešení funguje, akorát jsem tam musel z nějakého důvodu nastavit $_form.

	{var $_form => $form}
{foreach $form->getGroup('controls')->controls as $control}
{input $control->lookupPath('Nette\Forms\Form')}
{/foreach}