Autor Zpráva
Háva
Profil
Ahoj,

Mám formulář pro odesílání emailu s přílohou (pouze jedné), a chtěl bych ho upravit abych pomocí stisknutí nějakého odkazu (např více příloh), vyjeli automaticky další pole inputu pro přílohy. Čili někdo stiskne třikrát více příloh a já budu mít čtyři inputy.

Vím že musím použít tento input ale nevím jak udělat to generování po tom stisknutí.
<input type='file' name='foto[]'>


Děkuji za rady
TomasJ
Profil
Háva:
LeteckáPošta.cz to má takto:
var fileCount = 1;
function anotherFile()
{
	fileCount++;
      document.getElementById("files"+(fileCount-1)).innerHTML+=
		'<input type="file" name="fileup['+']" size="' + LangConst["fileInputHtmlSize"] + '"><br /><div id="files'+(fileCount)+'"></div>';
}


Tobě stačí
function AddInput()
{
document.getElementById('inputy').innerHTML+='<input type="file" name="foto[]"><br>';
}

A pak toto:
<form ...>
<div id="inputy">
<input type="file" name="foto[]"><br>
</div>
<a href="javascript:AddInput();">Více souborů</a>
</form>

A pokud chceš přehledný html když bude někdo zobrazovat zdroj. kód, dej si do té funkce AddInput() za to <br> ještě \n
EDIT: Toto je JavaScript, takže samozřejmě na začátek a konec musí přijít <script> </script>
EDIT2: Dál si pak musíš udělat v PHP kódu při nahrávání cyklus na tu proměnnou foto, která už bude pole
Chamurappi
Profil
Reaguji na TomaseJ:
Tobě stačí
To mu při kliknutí na „Více souborů“ musí smazat doposud vyplněné <input>y, ne?
TomasJ
Profil
Chamurappi:
Je to tak, na to jsem vůbec nepomyslel...

Háva:
No pak je teda způsob udělat stejně jak má LeteckáPošta ... Ten je:
JS:
<script>
var fileCount = 1;
function AddInput()
{
    fileCount++;
      document.getElementById("inputy"+(fileCount-1)).innerHTML+=
        '<input type="file" name="foto['+']"><div id="inputy'+fileCount+'"></div>';
}
</script>

HTML:
<div id="inputy">
<input type="file" name="foto[]"><br><div id="inputy1"></div>
</div>
<a href="javascript:AddInput();">Více souborů</a>
Háva
Profil
TomasJ:
Děkuji to je ono.

Jenom ještě když bych chtěl aby souboru bylo třeba max. 5.
Zkouším to takto ale to mi vypíše všech pět inputu najednou:
var fileCount = 1;

function AddInput()
{
while(fileCount<5){

    fileCount++;
      document.getElementById("inputy"+(fileCount-1)).innerHTML+=
        '<input type="file" name="foto['+']"><div id="inputy'+fileCount+'"></div>';
} }


Chtěl bych aby se vypisovali postupně při stisknutí a když už ji bude pět tak vypsalo hlášku, že už víc nejde.
TomasJ
Profil
Háva:
Po chvilce přemýšlení, jsem vytvořil přehlednější funkci (nastaveno omezení max. souborů):
<script>
var Inputs = 1; 
var maxInputs = 5; //Tady si můžeš nastavit počet maximálních inputů
function AddInput()
{
  if(Inputs < maxInputs)
  {
    var div=document.createElement('div');
    div.innerHTML='<input size="50" name="foto[]" type="file"><br>\n';
    document.getElementById("inputy").appendChild(div);
    Inputs++;
  }
  else{return alert("Více souborů vložit nemůžete (max. "+maxInputs+" souborů)!");}
}
</script>

<form method="post" enctype="multipart/form-data">
<div id="inputy">
<div><input size="50" name="foto[]" type="file"></div>
</div>
</form>
<button onclick="AddInput();">Přidat soubor</button>
Háva
Profil
TomasJ:
1.Jo dobrý, akorát mi to teď ty soubory přidává až na konci formuláře a ne pod tím prvním inputem, mám tam pak ještě další inputy a chtěl bych to ít samozřejmě řazené za sebou.
2 Existuje nějaká možnost aby po stisknutí tlačítka odeslat když provádím kontrolu zda jsou vyplněny všchna políčka, tak aby se mi nevymazala ta cesta od kud náhrávám ten soubor? U klasických inputu to mám udělané ale zajímá mě zda to jde i pro soubory?
TomasJ
Profil
Háva:
Ad 1. Předchozí příspěvěk jsem editoval, už se ti budou řadit pod sebe.
Ad 2. To nevím, třeba v javascriptu manipulace s historií - www.jakpsatweb.cz/javascript/objekt-window.html#history
Háva
Profil
TomasJ:
Ok. moc děkuji za rady.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: