Modal okno pro editaci položky

jedlicka

Ahoj,

měl bych dotaz na implementaci modal okna pro editaci položky ve formuláři.

Mám tlačítko:

<a data-toggle="modal" data-target="#carEdit" class="btn btn-primary" data-cuid="{$car->cuid}" data-spz="{$car->spz}"></a>

Když na toto tlačítko kliknu, tak se mi otevře modal okno.

<div class="modal fade" id="carEdit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Úprava informací</h4>
                </div>

                {form editCar}
                    <div class="modal-body" n:snippet="car-edit">
                        <fieldset>
                            <div class="row">
                                <section class="col col-6">
                                    <label class="input"> <i class="icon-append fa fa-car"></i>
                                        {input spz}
                                    </label>
                                </section>
                                <section class="col col-6">
                                    <label class="input"> <i class="icon-append fa fa-car"></i>
                                        {input model}
                                    </label>
                                </section>
                            </div>

                        </fieldset>
                    </div>

                    <footer>
                        <button type="button" class="btn btn-default" data-dismiss="modal">Zavřít</button>
                        {input create}
                    </footer>
                {/form}

            </div>
        </div>
    </div>

A v presenteru vytvoření formuláře:

<?php

public function createComponentEditCar()
    {
        $carTypes = Constants::getCarTypes();

        $form = new Form();
        $form->getElementPrototype()->id = 'smart-form-register';
        $form->getElementPrototype()->addClass('smart-form');
        $form->getElementPrototype()->addClass('client-form');

        $spz = $form->addText("spz")->setAttribute('class', 'form-control')
            ->setAttribute('placeholder', $this->translator->translate('system.warehouse_presenter.add_car_spz') . ' *')
            ->addRule(Form::FILLED, $this->translator->translate('system.warehouse_presenter.add_car_spz_rule'));
        $form->addText("model")->setAttribute('class', 'form-control')
            ->setAttribute('placeholder', $this->translator->translate('system.warehouse_presenter.add_car_model') . ' *')
            ->addRule(Form::FILLED, $this->translator->translate('system.warehouse_presenter.add_car_model_rule'));

        $form->addSubmit('create', $this->translator->translate('system.warehouse_presenter.edit_car_submit'))->setAttribute('class', 'btn btn-primary');
        $form->onSuccess[] = [$this, 'editCar'];

        return $form;
    }

?>

A teď bych potřeboval, aby se do toho formuláře (po otevření modalu) načetly informace z databáze podle dat z data-cuid a data-spz z tlačítka.

Jak to nejlépe udělat?

Díky moc za každou radu.

Martin

chemix

@jedlicka a kolik tech tlacitek mas na strance? Jedno? Nebo je to nejaky list vicero polozek?

jedlicka

@chemix přiznám se, že moc nechápu otázku. Na stránce je více tlačítek, a toto konkrétně vyvolává okno pro editaci nějakých informací. Je to jedno latte + jeden presenter, kde je celá stránka + i modaly.

Polki

@jedlicka Otázka byla, jestli máš pro toto konkrétní modální okno pouze jedno vyvolávací tlačítko na stránce, nebo zdali na té stránce máš nějaký seznam těch tlačítek, všechny vyvolávají to samé modální okno a jen se mění vyplnění formuláře podle toho, na které tlačítko se kliklo.

V případě, že je pouze jedno jediné tlačítko a data jsou tedy vždy předvyplněna stejně pro danou stránku, tak doporučuji data plnit již při vytváření formuláře.

V případě, kdy je na stránce vícero tlačítek, které vyvolávají toto samé modální okno a podle toho se liší vyplnění formuláře, tak doporučuji formulář plnit pomocí JS a to tak, že každé tlačítko bude mít v sobě data, která budou naplněna hodnotami, které budou v případě kliku na tlačítko vyplněna do formuláře.

V druhém případě se to dá udělat ještě i tak, že data po kliku na dané tlačítko načteš ze serveru tzv. lazy. To se ale hodí jen při větším množství dat, jelikož jinak je to zbytečné zatížení sítě.

PS: takto ti ten snippet uvnitř formuláře nebude fungovat viz: Video o snippetech od Davida Matějky

jedlicka

@Polki Jasný, už chápu. Je to vícero tlačítek, které otevírají stejný modal. Je to tabulka, a na každém řádku se dá kliknout na toto tlačítko, která na základě dat ze jednoho záznamu tabulky (např. id toho záznamu) načte jiná data z databáze a zobrazí je v modalu (editace těch dat). Chápu to udělat tím JS, díky.