Autor | Zpráva | ||
---|---|---|---|
kikinet Profil |
#1 · Zasláno: 13. 3. 2014, 18:20:56
Zdravím,
cílem kódu níže má být zobrazení nového inputu po kliknutí na button. Bude to script pro odesílání fotek, a jelikož nevím kolik fotek bude chtít uživatel nahrát, chci tlačítko, které zobrazí pole pro vložení další fotky. JavaScript vidím dneska podruhé, něco jsem hledala, ale většinou to nefunguje a netuším proč. <form method="POST" action="photo.php" enctype="multipart/form-data" id="form"> <input name="photo" type="file" /> <select name="group"> <option value="1">Příroda</option> ......... </select> <input name="next" type="button" onclick="newinput()" value="next" /> </form> v hlavičce tohoto mám připojení script function newinput(){ document.getElementById("form").innerHTML = '<input name="photo" type="file"/> <select name="group"> <option value="1">Příroda</option> ...... </select>' }; Napadá někoho co s tím? |
||
Kubo2 Profil |
#2 · Zasláno: 13. 3. 2014, 19:55:02
kikinet:
Toto by malo fungovať spoľahlivo. V CSS som kvôli zalamovaniu riadkov nastavil input[type=file], button { display: block; } |
||
Časová prodleva: 4 dny
|
|||
kikinet Profil |
#3 · Zasláno: 17. 3. 2014, 14:41:17
Kubo2:
Díky za odpověď, ale asi to moc nechápu. V podstatě asi jen jednu věc: co píšeš do action u formuláře? JS mám připojené externě |
||
Kubo2 Profil |
kikinet:
Do action by bolo zrejme vhodné napísať adresu (webovú adresu) nejakého serverového programu, ktorý má za úlohu nahrávať súbory resp. fotky na tvoj server.
1 rada: JS pripájaj až za resp. pod kódom formulára. Ak ešte niečomu inému nerozumieš, v poriadku, len sa spýtaj, rád ti pomôžem. |
||
kikinet Profil |
Kubo2:
No jasně, myslela jsem, že jsem nepochopila ten action, ale ve skutečnosti to bylo proto, že jsem se přepsala a napsala navíc 'tečku'. Už to funguje super :) Jen bych ještě potřebovala aby se zároveň s tím tlačítkem objevilo i to pole <option> ... </option>
Edit: Ok, už jsem si s tím pohrála: (function(){ document.forms['photo-uploader'].elements['addmore'].onclick = function() { var newfile = document.createElement('input'); newfile.type = 'file'; newfile.name = 'photo[]'; this.parentElement.insertBefore(newfile, this); var newfile = document.createElement('select'); newfile.name = 'group[]'; this.parentElement.insertBefore(newfile, this); var option = document.createElement('option'); option.value = '1'; option.text = 'Příroda'; newfile.add(option); var option = document.createElement('option'); option.value = '2'; option.text = 'Lidé'; newfile.add(option); var option = document.createElement('option'); option.value = '3'; option.text = 'Zvířata'; newfile.add(option); var option = document.createElement('option'); option.value = '4'; option.text = 'Nezařazeno'; newfile.add(option); return false; } })() 2) Pokud jsem to dobře pochopila, photo[] a group[] mi zajistí, že se tyto data budou posílat v array(). (asi?) Tím pádem při procházení souborů potom bude přiřazená hodnota optionu odpovídat nahrané fotce? 3) Už se mi nedaří hodit pod každý nově vložený input hodit čáru <hr /> pro lepší přehlednost
|
||
Kubo2 Profil |
#6 · Zasláno: 19. 3. 2014, 18:52:03
kikinet:
„aby se zároveň s tím tlačítkem objevilo i to pole <option>“ To je potom obdobné, akurát si naviac vytvoríš ešte aj element <select> (alebo ho naklonuješ). Stačí pridať niekoľko riadkov alebo kód skrátiť na tri riadky. Môže byť? ;-)
|
||
_es Profil |
kikinet:
„Je i efektivnější způsob jak vložit option mezi select?“ Je: Ajax přidání options do selectu nefunguje v IE „photo[] a group[] mi zajistí, že se tyto data budou posílat v array(). (asi?)“ Vyžaduje to tak PHP - tie hranaté zátvorky, inak to je jedno. |
||
Kubo2 Profil |
#8 · Zasláno: 19. 3. 2014, 19:09:41
kikinet:
Ad 1): Áno je, viď príspevok od _esa ([#7]). Ad 2): -- Ideš na to dobre, ale array si z toho vytvorí až interpret PHPka (ak, samozrejme, používaš PHPko).
-- K tej druhej otázke: približne tak to je, aj keď $_FILES (pole, ktoré si v PHPku drží informácie o súboroch poslaných na server) sa pri väčšom počte súborov prechádza trošku zložitejšie, vďaka extrémne úspornej štruktúre.
Ad 3): Stačí to <hr> pridať do toho prvého <label> u, ono sa to potom celé naklonuje -- viď moje riešenie (odkaz v [#6]).
|
||
kikinet Profil |
#9 · Zasláno: 19. 3. 2014, 19:39:02
_es, Kubo2:
Skvělé, děkuji oběma. Tak teď ještě odzkoušet script na odesílání fotek a je to. Ještě jednou dík :) |
||
Časová prodleva: 11 let
|
0