TinyMCE-an invalid form control
- inzacz
- Člen | 17
Vím, že TinyMCE již tu bylo probírané několikrát, ale nesetkal jsem se tu s řešením chyby která trápí mne.
Podařilo se mi bez problému navázat TinyMCE na textareau a zprovoznil
validování. Problém je, že formulář se při nevyplněném textu sice
neodešle, ale nezobrazí hlášku o nutnosti vyplnění a konzole vyhodí
chybu
An invalid form control with name=‚text_p‘ is not focusable., kde
text_p je název textového pole při vytváření formuláře. Zkoušel jsem
více způsobu odstranění chyby, ale žádný z návodu na tinyMCE mi
nepomohl.
Přikládám dvě různé verze, obě fungují stejně..
public function createComponentFirmyNote() {
$form = new AppForm;
$form->addTextArea('text_n', 'Poznámka')->addRule(Form::FILLED, 'Musí být zadán text');
$form->getComponent('text_n')->getControlPrototype()->class('mceEditor');
$form->addSubmit('newnote', 'Přidat');
$form->onSuccess[] = callback($this, 'executeFirmyNote');
$form->getElementPrototype()->onSubmit('tinyMCE.triggerSave()');
return $form;
}
public function createComponentFirmyCall() {
$form = new AppForm;
$form->addTextArea('text_p', '')->addRule(Form::FILLED, 'Musí být zadán text')->getControlPrototype()->class('mceEditor');
$form->addSubmit('newcall', 'Přidat')->getControlPrototype()->onclick('tinyMCE.triggerSave()');
$form->onSuccess[] = callback($this, 'executeFirmyCall');
return $form;
}Přikládám dvě různé verze, obě fungují stejně..
- llsm
- Člen | 121
Tak jsem to u sebe trochu vyzkousel a poslu ti, jak mam kod ja. Pokud mam navazane pravidlo (libovolne addRule) na element, ktery je tinyMCE, tak mi to nefunguje.
<?php
public function createComponentProblemForm() {
$form = new AppForm();
$form->addText('name', 'název', 45)->addRule(Form::FILLED, 'Musí být zadán text');
$form->addTextArea('symptoms', 'projevy problému')->getControlPrototype()->class('mceEditor');
$form->addCheckBox('visible', 'veřejné');
$form->addSubmit('add','přidat')->onClick[] = array($this, 'processAddProblemForm');
$form->getElementPrototype()->onsubmit('tinyMCE.triggerSave()');
return $form;
}
?>a v sablone:
<script>
tinyMCE.init({
mode: "specific_textareas",
editor_selector: "mceEditor",
theme : "advanced",
plugins : "xhtmlxtras",
theme_advanced_buttons1 : "bold,italic,cite,|,link,unlink,image,|,bullist,numlist,|,undo,redo,|,formatselect",
theme_advanced_buttons2 : "",
theme_advanced_buttons3 : "",
theme_advanced_buttons4 : "",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "center",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
content_css : "/css/screen.css"
});
</script>Jestli ti to pomuze, nezapomen napsat, v cem jsi mel chybu… ;)
Editoval llsm (8. 3. 2012 21:22)
- llsm
- Člen | 121
At to zkousim jak to zkousim, pokud mam na tinyMCE textarea pridane validacni pravidlo (addRule(blabla)), tak mi prestane fungovat odeslani formulare. A reseni se mi nedari najit. Pokud chces za kazdou cenu kotrolovat, jestli v tom poli neco je, tak se asi jako berlicka da udelat to, ze si tu kontrolu udelas az v metode, ktera zpracovava data z odeslaneho formulare. Neni to tak elegantni a musi se kvuli tomu znovu nacist stranka, ale muze to byt lepsi nez nic…
- Rellik
- Člen | 104
Já TinMCE používám v administraci a funguje i addRule. Taky sem s tím
měl ze začátku problém, ale pak to šlo celkem jednoduše.
presenter s formem, kde mám tinyMce:
https://github.com/…resenter.php#L43
Jediný rozdíl v šabloně je ten, že sem si dal ten JS do externího
souboru..
https://github.com/…layout.latte#L20
https://github.com/…ter/js/js.js
- llsm
- Člen | 121
Tak jsem to pozlobil a pro budouci generace:
TinyMCE funguje tak, ze puvodni element, vetsinou textarea, udela
display: hidden; a misto toho si vytvori svuj novy se vsema zuzo
featurama apod. Proto bezna validace se na prvku nezobrazi narozdil od ostatnich
prvku, ktere jsou puvodni a validace je na ne navazana.
Pokud clovek pouzije Live
form validator, je situace uz trochu lepsi. Tam je akorat potreba dostylovat
chybovou hlasku, aby se zobrazila, protoze defaultne ji TinyMCE take nastavi
inline display: hidden;. Je tedy potreba do css souboru prihodit
.form-error-message {display: block !important;} a zprava se uz
vypise. Pak uz si ji muze clovek dostylovat jak chce.
Dekuji Rellikovi za jeho kod, bez nej bych to asi nevyresil.
- mav
- Člen | 12
Vše výše uvedené mi funguje, jen např. při neplatné kontrole reCaptcha se jen pole s MCE Editorem smaže, ostatní pole zůstanou naplněna. Nefunguje mi ani ->setDefaultValue(‚…‘);
<?php
protected function createComponentContactForm()
{
...
$form->addTextArea('vzkaz', 'Vzkaz:', 50)
->addRule(Form::FILLED, 'Nevyplnili jste vzkaz.')
->addRule(Form::MAX_LENGTH, 'Text je příliš dlouhý', 500)
->getControlPrototype()->class('mceEditor');
$form->addText('recaptcha_response_field', '', 30, 30)
->addRule(Form::FILLED, 'Zadejte kontrolu proti spamu.');
$form->addSubmit('create', 'Odeslat');
$form->getElementPrototype()->onsubmit('tinyMCE.triggerSave()');
$form->onSuccess[] = callback($this, 'contactFormSubmitted');
return $form;
}
public function ContactFormSubmitted(Form $form)
{
$resp = BasePresenter::reCaptcha();
if (!$resp) {
$this->flashMessage('Zadejte znovu kontrolu proti spamu.', error');
if (!$this->presenter->isAjax()) {
$this->redirect('this');
} else {
$this->invalidateControl('form');
$this->invalidateControl('flashMessages');
}
} else {
...zaslání vzkazu...
}
?>
- MartyIX
- Člen | 217
http://stackoverflow.com/…oogle-chrome – tady je osvetleni problemu
Resil jsem to pomoci:
$form = new Form($this, 'form');
$form->getElementPrototype()
// Validation is disabled because Chrome's form validation may lead to a JS error
// http://stackoverflow.com/questions/7168645/invalid-form-control-only-in-google-chrome
->novalidate("novalidate");Editoval MartyIX (9. 3. 2013 16:10)