Form renderer, přidání rodiče pro upload input

Upozornění: Tohle vlákno je hodně staré a informace nemusí být platné pro současné Nette.
Fyasko
Člen | 106
+
0
-

Ahoj všem, opět se na vás obracím s prosbou o radu. Mám napsaný vlastní render na formuláře pro bootstrap a trápí mě tlačítko pro výběr souborů. Chtěl bych si ho upravit. Přidat mu rodiče. Asi by to šlo přes js, ale raději bych to měl v renderu.

Toto:
<input type="file" class="file-upload">

Bych rád do tohoto tvaru:
<button>
<input type="file" class="file-upload" >
</button>

Dalo by se to udělat v tomto?

<?php
public function render(Form $form, $mode = NULL)
    {
        foreach ($form->getControls() as $control) {
           if ($control instanceof UploadControl) {
                $control->getControlPrototype()->addClass('file-upload');
				// ...
            }
        }
        return parent::render($form, $mode);
    }
?>
GEpic
Člen | 566
+
+1
-

Fyasko napsal(a):

Ahoj všem, opět se na vás obracím s prosbou o radu. Mám napsaný vlastní render na formuláře pro bootstrap a trápí mě tlačítko pro výběr souborů. Chtěl bych si ho upravit. Přidat mu rodiče. Asi by to šlo přes js, ale raději bych to měl v renderu.

Toto:
<input type="file" class="file-upload">

Bych rád do tohoto tvaru:
<button>
<input type="file" class="file-upload" >
</button>

Dalo by se to udělat v tomto?

<?php
public function render(Form $form, $mode = NULL)
    {
        foreach ($form->getControls() as $control) {
           if ($control instanceof UploadControl) {
                $control->getControlPrototype()->addClass('file-upload');
				// ...
            }
        }
        return parent::render($form, $mode);
    }
?>

<button>
<input type="file" class="file-upload" >
</button>

Tomu bych se vyhl, můžeš použít div, cokoliv, jen nevkládej formulářový prvek do formulářového prvku.

PS: Výchozí input file se dost těžko ohýbá, většinou se skryje a „nasimuluje“ k němu nějaký jiný prvek, nebo se nastyluje jeho label (a file input opět skryje).

Je úplně jedno čím vším file input obalíš, vždycky bude dělat problémy, dokud ho neskryješ. :)

Editoval GEpic (19. 8. 2016 9:03)

Pavel Kravčík
Člen | 1196
+
0
-

To je šílený… :)

Pokud chceš udělat klikací drowzone nebo něco, lépe použít div (jak psa Gepic) a jQuery.

Zuben45
Člen | 268
+
+1
-

Pokud se jedná o drag & Drop upload, tak doporučuji článek http://jecas.cz/upload, máš to i s ukázkou ;)

Fyasko
Člen | 106
+
0
-

Na stackoverfolw jsem našel pár řešení pro změnu vzhledu v tomto formátu. Nemusí to být přesně tak jak jsem napsal. Můžu to být např.:

<div class="whatever">
<input tyle="file" class="file-upload">
</div>

Stále jde ale o přidání resp. úpravu toho rodiče, protože wrapper pro controly je všude stejný že. Proto hledám instanci pro upload a následně bych chtěl upravit její vykreslení :)

GEpic
Člen | 566
+
0
-

Fyasko napsal(a):

Na stackoverfolw jsem našel pár řešení pro změnu vzhledu v tomto formátu. Nemusí to být přesně tak jak jsem napsal. Můžu to být např.:

<div class="whatever">
<input tyle="file" class="file-upload">
</div>

Stále jde ale o přidání resp. úpravu toho rodiče, protože wrapper pro controly je všude stejný že. Proto hledám instanci pro upload a následně bych chtěl upravit její vykreslení :)

Jak jsem řekl, vykreslení input[type='file'] neovlivníš klasickým způsobem.

Editoval GEpic (19. 8. 2016 20:32)