Nextras\Forms – užitečné formulářové komponenty

Zdravim,
snazim se pouzit MultiOptionsList

$form->addMultiOptionList('level', 'Level:', array('DEBUG' => 'DEBUG', 'INFO'=> 'INFO', 'WARN' =>'WARN', 'ERROR' => 'ERROR);

a potrebuji mit promenou $level persistentni

pokud zatrhnu ve formulari napriklad WARN a ERROR vygeneruji se mi v odpovedi (html) dva hidden inputy
<input type=„hidden“ name=„level[0]“ value=„WARN“ /><input type=„hidden“ name=„level[1]“ value=„ERROR“ />

pokud pouziji formular znovu dochazi k chybam, hidden input a checkbox se vzajemne ovlivni a ve vysledna promena $level obsahuje nesmysly

Nemuzete me nejak nakopnout …

Editoval barbucha (30. 1. 2013 12:04)

Tak pokud potrebujes mit $level persistentni, tak v obsluzny onSuccess metode asi udelas neco jako $this->level = $values['level'] (pokud jsi v presenteru/control prvku). A pri tvorbe formalure
$form->addMultiOptionList('level', 'Level:', array('DEBUG' => 'DEBUG', ...)->setDefault($this->level);

Zdar, snazim sa rozbehat tieto komponenty, skopiroval som kod z ukazky

$form->addMultiOptionList('list2', 'Pick your interests', ['d', 'e', 'f'])
     ->addRule($form::LENGTH, 'You must pick just 1 or 2 interests.', array(1, 2));
?>

{form example}
<table>
<tr>
    <th>{label list1/}</th>
    <td>{input list1}</td>
</tr>
<tr>
    <th>{label list2/}</th>
    <td>
    {foreach $form['list2']-items as $key => $label}
        {label list2:$key class => checkbox}
            {input list2:$key}
            {$label}
        {/label}
    {/foreach}
    </td>
</tr>
</table>
{/form}

ale najprv dostanem chybu
Use of undefined constant items - assumed 'items'
pravdepodobne tam ma byt teda
$form['list2']->items
ale po opraveni zase dostanem
Component with name 'list2:0' does not exist.

je este nieco potrebne niekde pridat?
dakujem

Editoval boob (24. 4. 2013 13:09)

hrach: aha a nightly verziu coho? Nette? vo verzii 2.0.8 to nie je? ked pozeram, ze uz pred 3 mesiacmi sa toto riesilo? :) a nextras/forms cez composer mam dev-master

dakujem

ah soo :) dakujem pekne, vyskusam, napisem

edit:

mam nainstalovane Nette 2.0.10 a nextras/forms 1.0.0, ale aj tak mi to pise Component with name 'list2:0' does not exist.

Editoval boob (29. 4. 2013 11:37)

Pres data-format attribut ;)

@duskohu: pokud je to v tom dateinput elementu stejně jako v těch jiných co jsem viděl tak mají formát data natvrdo jako konstantu ve třídě. Řešil jsem to tak že jsem to předělal na proměnnou a přidal setter kterým jsem to mohl nastavovat, ale nakonec jsem to zahodil a udělal vlastní formextension přímo pro bootstrap který mě dělá input prepend či append a je tam i clear button.

EDIT:
aha asi sem tě přesně nepochopil, chceš změnit použitý formát přímo už v tom co dělá ten plugin? Konkrétně ten co odkazuješ používám taky a v tom obalovacím DIVu kde mám zadefinované options mám taky data atribut pro určení formátu.

Editoval akadlec (9. 7. 2013 8:53)

@duskohu: Máš špatný data atribut:

<div class="input-append date" data-date-format="dd.mm.YYYY">
	....
</div>

Editoval akadlec (9. 7. 2013 9:22)

@akadlec dik, ach jaj ta nepozornost :-P, ale aj napriek tomu to nepomohlo :-(

@duskohu: tak v tom případě tam máš něco špatně a něbo to někde přetěžuješ, ty dataatributy fungují bez problému, sám ten skript na který si linkoval pro bootstrap používám a celý konfig datepickeru mám právě přes data atributy

/**
 * Generates control's HTML element.
 *
 * @return \Nette\Web\Html
 */
public function getControl()
{
        $control = parent::getControl();

        if ( $this->isDisabled() )
                $this->buttonStyle = self::BUTTON_STYLE_ICON_NONE;

        $outter = $this->buttonStyle == self::BUTTON_STYLE_ICON_LEFT || $this->buttonStyle == self::BUTTON_STYLE_ICON_RIGHT ? \Nette\Utils\Html::el('div') : $control;

        if ( $this->buttonStyle == self::BUTTON_STYLE_ICON_LEFT ) {
                $outter->addClass('input-prepend date');

        } else if ( $this->buttonStyle == self::BUTTON_STYLE_ICON_RIGHT ) {
                $outter->addClass('input-append date');
        }

        $outter->addClass($this->className);

        // Set dataatribute options

        // The date format, combination of p, P, h, hh, i, ii, s, ss, d, dd, m, mm, M, MM, yy, yyyy
        $outter->data['date-format'] = $this->format;
        // Day of the week start. 0 (Sunday) to 6 (Saturday)
        $outter->data['date-weekstart'] = $this->weekStart;
        list($min, $max) = $this->extractRangeRule($this->getRules());
        // The earliest date that may be selected
        if ( $min !== NULL )
                $outter->data['date-startdate'] = $min->format($this->toPhpFormat ($this->format));
        // The latest date that may be selected
        if ( $max !== NULL )
                $outter->data['date-enddate'] = $max->format($this->toPhpFormat ($this->format));
        // Days of the week that should be disabled. Values are 0 (Sunday) to 6 (Saturday)
        if ( $this->daysOfWeekDisabled !== NULL )
                $outter->data['date-days-of-week-disabled'] = implode(',', $this->daysOfWeekDisabled);
        // Whether or not to close the datetimepicker immediately when a date is selected
        $outter->data['date-autoclose'] = $this->autoclose ? 'true' : 'false';
        // The view that the datetimepicker should show when it is opened
        $outter->data['start-view'] = $this->startView;
        // The lowest view that the datetimepicker should show
        $outter->data['min-view'] = $this->minView;
        // The highest view that the datetimepicker should show
        $outter->data['max-view'] = $this->maxView;
        // If TRUE or "linked", displays a "Today" button at the bottom of the datetimepicker to select the current date
        $outter->data['date-today-btn'] = $this->todayButton;
        // If TRUE, highlights the current date.
        $outter->data['date-today-highlight'] = $this->todayHighlight;
        // Enable keyboard for navigation
        $outter->data['date-keyboard-navigation'] = $this->keyboardNavigation;
        // The two-letter code of the language to use for month and day names
        $outter->data['date-language'] = $this->language;
        // Whether or not to force parsing of the input value when the picker is closed
        $outter->data['date-force-parse'] = $this->forceParse;
        // This option is currently only available in the component implementation
        $outter->data['picker-position'] = $this->pickerPosition;
        // Default date
        if ( $this->value )
                $outter->data['date'] = $control->value = $this->value->format($this->toPhpFormat($this->format));

        if ( $this->buttonStyle == self::BUTTON_STYLE_ICON_LEFT ) {
                // Trigger button
                $outter->add('<span class="add-on"><i class="icon-calendar"></i></span>');
                // Cancel button
                if ( $this->cancelButton ) {
                        $outter->add('<span class="add-on"><i class="icon-remove"></i></span>');
                }
                // Input field
                $outter->add($control);

        } else if( $this->buttonStyle == self::BUTTON_STYLE_ICON_RIGHT ) {
                // Input field
                $outter->add($control);
                // Cancel button
                if ( $this->cancelButton ) {
                        $outter->add('<span class="add-on"><i class="icon-remove"></i></span>');
                }
                // Trigger button
                $outter->add('<span class="add-on"><i class="icon-calendar"></i></span>');
        }

        return $outter;
}

nextras/forms jsou opěz kompatibilní s masterem. Nově přibyla jednoduchá možnost tvorby svých input maker, které input etc. upraví do podoby, které potřebuje váš kodér. Jako příklad je možné uvést též nové Bootstrap 3 makro. Tyto makra je možné dále rozšířovat, dle pořeby daného webu.

Cau, podporuje MultiOptionList toggle ? lebo som to skusal nasadit, ale neslo mi to.

@hrach nevadi, nejako si uz poradim :-), aj tak dakujem pekna praca.

Je možné aby mi toto nefungovalo?

$form->addDateTimePicker('time_from', 'Datum a čas výjezdu:')
			 ->addRule(\Nette\Application\UI\Form::VALID, 'Entered date is not valid!')
			 ->addCondition(\Nette\Application\UI\Form::FILLED);

EDIT:

Shazuje mi to apache, pokud ale smažu validace je to funkční

Editoval JimmyBlack (22. 8. 2013 0:24)

Je to super, rád bych to použil, ale podle všeho to funguje pouze s master verzí Nette. A tu se zase nedoporučuje používat. Lze to nějak aplikovat na poslední stable verzi Nette, abych to mohl reálně použít?

Děkuji

Konkrétně mi jde o OptionList, ale Nette 2.0.12 ještě neumí {input name:xxx}, které to generuje. Nebo dělám něco špatně?

Zdravím,
chtěl bych používat Nextras\Forms pro renderováníé Bootstrap 3. Je nějak možné při manuálním vykreslování nějak vykreslit celý pár? Tedy label i input? Kdyby\BootstrapRenderer má na to sympatické makro {pair}, které to obstarává, je něco takového možné u Nextras, případně jak na to? Protože často potřebuji vypsat oba najednou a když udělám {label }{input}, tak pak musím logicky ten obalovaci div class=„form-group“ dělat ručně, což je moc pracný…

Dival jsem se na kod, ale prilis moudry jsem z toho nebyl. Samozrejme jsem si vsiml metody renderPair. ale mejak jsem moc nepochopil jak to použít dospěl jsem k něemu takovému:

{form form}
{$form->renderer->renderPair($input)}
{/form}

jenže skončím s chybou na

$this->form->getElementPrototype()->class('form-horizontal');

s tím že není definován $this->form

Já to nakonec vyřešil tím, že jsem podědil ten Nextras renderer a s vlastním formulářovým makrem, mj nastavuji ten $this->form, tak to pak funguje. Ale třeba dělám něco špatně.

• co si pamatuju, tak se renderer pouziva nejak takto:

{$form->render(begin)}
{$form->render(pair, $input)}
{$form->render(end)}

tj právě přesně to co mi klasicky nefungovalo a kvůli kterému jsem rozšiřoval ten tvůj Renderer. Protože pokud koukám správně do kódu, tak DefaultFormRenderer v metodě render jako parametr mode nezpracovává pair… Metoda renderPair je volána jen z renderControls, která je volána z renderBody…

urcite je blbost kombinovat renderer a makra

nevím jestli se chápeme, já si jen udělal vlastní makro {pair}, který jen volá ten můj urpavený render:

public function macroPair(MacroNode $node, PhpWriter $writer)
{
	return $writer->write('$__form->render(\'pair\', $__form[%node.word])');
}

@Azathoth zalezi na datepickeru. Komponenta v nextras je primarne rendering do html5. ukazka,jak to tranformovat to nejakyho pickeru je spis demo ;) Jde ti o format data, nebo o co?

no nacist ten soubor, ne?

Narazil jsem na drobný, ale protivný problém. Pokud použiju CheckboxList ve spojení s Bs3Input makry, dojde k chybě v šabloně:

Call to a member function addAttributes() on a non-object

// z šablony
$_input = $_form["exampleChecklist"];
echo Nextras\Forms\Bridges\Latte\MacrosBS3InputMacros::input($_input->getControl()->addAttributes(array()), $_input)

Problém je v tom, že Checkboxlist::getControl vrací string.

Obejít se to dá tím, že místo CheckboxListu využiju MultiOptionList z Nextras. Existuje řešení, při kterém mohu využít nettí CheckboxList?

Už to tu několikrát bylo, ale řešení tu nikde není.
Mám verzi Nette 2.0.18 a stáhl jsem si Forms verzi 1.0.0.
Pokud si chci multiOptionList vykreslit ručně, tak to píše chybu Component with name ‚roles:1‘ does not exist.

config

<?php
nette:
        latte:
            macros:
                - Nextras\Forms\Latte\Macros::install
?>

Bootstrap

<?php
use Nette\Forms\Container;
use Nextras\Forms\Controls;
Container::extensionMethod('addOptionList', function (Container $container, $name, $label = NULL, array $items = NULL) {
    return $container[$name] = new Controls\OptionList($label, $items);
});
Container::extensionMethod('addMultiOptionList', function (Container $container, $name, $label = NULL, array $items = NULL) {
    return $container[$name] = new Controls\MultiOptionList($label, $items);
});
Container::extensionMethod('addDatePicker', function (Container $container, $name, $label = NULL) {
    return $container[$name] = new Controls\DatePicker($label);
});
Container::extensionMethod('addDateTimePicker', function (Container $container, $name, $label = NULL) {
    return $container[$name] = new Controls\DateTimePicker($label);
});
Container::extensionMethod('addTypeahead', function(Container $container, $name, $label = NULL, $callback = NULL) {
    return $container[$name] = new Controls\Typeahead($label, $callback);
});
?>

Komponenta

<?php
$form->addMultiOptionList('roles', 'Vyberte role', $this->roleRepository->findAll()->fetchPairs('id', 'title'));
?>

Latte

{form example}
...
<tr>
            <th>{label roles /}</th>
            <td>
                {foreach $form['roles']->items as $key => $label}
                    {dump $key}
                    {label roles:$key}
                        {input roles:$key}
                    {$label}
                    {/label}
                {/foreach}
            </td>
        </tr>
...
{/form}