[JavaScript] Formularz z selektorami plików

Forum dotyczące ogólnie pojętego programowania - algorytmów, struktur danych, narzędzi programistycznych, itp - głównie w kontekście komputerów PC.
ODPOWIEDZ
michj
-
Posty: 83
Rejestracja: 22 gru 2012, 12:22
Lokalizacja: Polska

[JavaScript] Formularz z selektorami plików

Post autor: michj » 02 cze 2013, 19:18

Cześć,
na swojej stronie tworzę formularz z selektorami plików. Najpierw wyświetlony jest tylko jeden selektor, po wybraniu pliku ma się wyświetlić następny itd. Po wybraniu pliku pojawia się następny selektor, ale niestety znikają pliki z poprzednich selektorów (są napisy "Nie wybrano pliku"). Jak to zrobić, aby poprzednie selektory nie resetowały się? Podaję kod kluczowej części strony.

Kod: Zaznacz cały

<form action="addart.php" method="post" enctype="multipart/form-data">
<textarea id="t" name="tresc" cols="100" rows="25">
</textarea><br>
<div id="f">
</div>
<script>
var licz = 1;
var v = new Array();
document.getElementById("f").innerHTML='<input id="f1" type="file" name="plik1" onchange="wstaw(1);"><br>';
function wstaw(num)
{
	var c=String.fromCharCode(92);
	var s=document.getElementById("f"+num).value;
	v[num] = new Array();
	v[num][0]=document.getElementById("f"+num).disabled;
	v[num][1]=document.getElementById("f"+num).accept;
	v[num][2]=document.getElementById("f"+num).form;
	v[num][3]=document.getElementById("f"+num).name;
	v[num][4]=document.getElementById("f"+num).type;
	v[num][5]=document.getElementById("f"+num).value;
	var p=s.lastIndexOf(c);
	var nazwa=s.substring(p+1);
	var format=s.substring(s.lastIndexOf('.')+1);
	var img = new Array('jpg','JPG','gif','GIF','png','PNG','tif','TIF');
	var b = false;
	for(var i = 0; i<8; ++i)
	{
		if(format==img[i])
		{
			b = true;
		}
	}
	if(nazwa!="" && b)
	{
		document.getElementById("t").value+="<img src=\"obrazy/"+nazwa+"\">";
	}
	if(num==licz)
	{
	licz++;
	document.getElementById("f").innerHTML+="<input id=\"f"+licz+"\" type=\"file\" name=\"plik"+licz+"\" onchange=\"wstaw("+licz+");\"><br>";
	/*for(var i = 1; i<licz; ++i)
	{
		document.getElementById("f"+i).disabled=v[i][0];
		document.getElementById("f"+i).accept=v[i][1];
		document.getElementById("f"+i).form=v[i][2];
		document.getElementById("f"+i).name=v[i][3];
		document.getElementById("f"+i).type=v[i][4];
		document.getElementById("f"+i).value=v[i][5];
	}*/
	}
}
</script>
<input type="submit" value="Dodaj artykuł"><br>
</form>
Jak widać próbowałem rozwiązać problem, zapisując i wpisując dane poprzednich selektorów, ale nie pomogło :sad:

PS Szukałem trochę czegoś w necie.

michj
-
Posty: 83
Rejestracja: 22 gru 2012, 12:22
Lokalizacja: Polska

Post autor: michj » 07 cze 2013, 20:58

Poradziłem sobie z problemem :smile:

Kod: Zaznacz cały

<form action="addart.php" method="post" enctype="multipart/form-data">
<textarea id="t" name="tresc" cols="100" rows="25">
</textarea><br>
<div id="f1">
<input type="file" id="plik1" name="plik1" onchange="wstaw(1);"><br>
<div id="f2">
</div>
</div>
<input type="submit" value="Dodaj artykuł"><br>
<script>
var url = String(window.location);
var id = parseInt(url.substring(url.indexOf('id=')+3));
var licz = 1;
function wstaw(i)
{
	var pn = document.getElementById('plik'+i).value;
	var fn = pn.substring(pn.lastIndexOf(String.fromCharCode(92))+1);
	var format = fn.substring(fn.lastIndexOf('.')+1);
	if(format=='jpg' || format=='JPG' || format=='gif' || format=='GIF' || format=='png' || format=='PNG' || format=='tif' || format=='TIF')
	{
		document.getElementById('t').value+=('<img src="obrazy'+id+'/'+fn+'">');
	}
	if(i==licz)
	{
		licz++;
		document.getElementById('f'+licz).innerHTML+=('<input type="file" id="plik'+licz+'" name="plik'+licz+'" onchange="wstaw('+licz+');"><br><div id="f'+(licz+1)+'"></div>');
	}
}
</script>
</form>
Jak widać, stworzyłem jakby kaskadę bloków (znaczników div) :grin:

ODPOWIEDZ