Nette ekvivalent pro JS ziskani dat ze stranky

Darthy

Používám plugin TinyMCE a pomocí JS z něj získávám přeložený obsah HTML. Chtěl bych jej ale dále zpracovávát, respektive uložit jej do nějaké proměnné (nejlépe se k tomu dostat v presenteru) pro další zobrazení, případně uložení do databáze. Pomocí javaScriptu jsem schopen data získat, ale nemůžu už je tak odeslat do DB.

{block title}
TinyMCE
{/block}
{block content}
<form id="get-data-form" method="post">
    <div class="log">
        <textarea class="tinymce" id="texteditor"></textarea>
    </div>
    <div class="log">
        <div class="send-button">
            <button class="btn btn-default" type="submit" value="Get Data">Zdrojovy kod</button>
        </div>
        <textarea id="data-container">

        </textarea>
    </div>
</div>
</form>
{/block}

a pomoci js po kliknuti na tlacitko zobrazim preformatovany text do textarea „data-container“.

$(document).ready(function(){

	$("#get-data-form").submit(function(e){

		var content = tinymce.get("texteditor").getContent();

		$("#data-container").text(content);

		return false;

	});

});

O co mě ale jde je, že bych chtěl js vynechat (pokud možno) a používat jen presenter a latte. Co ovšem nevím, jak v tomhle případě js soubor nahradit přímo v latte, a získat data z tinymce.get(„texteditor“).getContent() po kliknutí na tlačítko. Jsem dost zmatený a v dokumentaci jsem zatím nenašel nápovědu, jen vytvořené formuláře, což v podstatě nechci, protože už mám nějaký objekt (tinymce editor) chovající se jako formulář…

CZechBoY

TinyMCE ber jen jako textový políčko, který ti pošle jako odpověď HTML (je to stejný jako by to html napsal uživatel).
Tudíž v Nette

{block title}
TinyMCE
{/block}
{block content}
<form n:name="mujForm" id="get-data-form" method="post">
    <div class="log">
        <textarea n:name="mojeHtml" class="tinymce" id="texteditor"></textarea>
    </div>
    <div class="log">
        <div class="send-button">
            <button n:name="mujSubmit" class="btn btn-default" type="submit">Odeslat</button>
        </div>
    </div>
</div>
</form>
{/block}

use Nette;

class MujPresenter extends Nette\Application\UI\Presenter
{
	protected function createComponentMujForm
	{
		$form = new Nette\Application\UI\Form;

		$form->addTextArea('mojeHtml');

		$form->addSubmit('mujSubmit');

		$form->onSuccess[] = function ($form, array $values) {
			\Tracy\Debugger::barDump($values, 'hodnoty odeslaného formuláře');
		});

		return $form;
	}
}

Editoval CZechBoY (27. 2. 2017 19:41)

Darthy

Super, funguje to. Pokud tomu teda rozumím, tak

		$form->addTextArea('mojeHtml');
$form->addSubmit('mujSubmit');

funkce addTextArea() a jakýkoliv jiný add, vlastně jen vytvoří „container“ v instanci $form, aby to vytvořilo ve view tyto prvky musel bych použít {control mujForm}. Jinak pomocí makra n:name do nich můžu přiřadit „jakýkoliv“ prvek z view?

CZechBoY

Formulář je komponenta – kontejner na další komponenty – inputy.
Pokud použiješ manuální renderování (viz příklad nahoře) tak je dobré si všechny inputy vytvořit i v Nette (pro prolinkování validace, v příkladu nahoře žádná validace není tak je to skoro jedno). Hlavně ale musíš použít <form n:name="mujForm"> jinak se ti správně nenastaví formulář a nepojede ti to.
Kontejner bych formuláři neříkal (ikdyž to fakt kontejner je protože dědí od Forms\Container :D), ale ve formuláři můžeš mít opravdu další kontejner ($form->addContainer()) a pak by se ti to nejspíš pletlo.

Darthy

Jo, zrovna jsem se díval na Jak na komponenty v Nette a dává to hned větší smysl. Díky