Autor Zpráva
moel
Profil *
Zdravím,
potreboval by som dynamicky upload-nuť súbory pomocou jquery, našiel som pomerne veľké množstvo návodov, ktoré sú len minimálne odlišné, ale nezhodujú sa s mojou predstavou resp. potrebami. Toto je originálny zdrojový kód (časť), ktorému celkom nerozumiem resp. neviem ho upraviť tak ako si predstavujem:

<script type="text/javascript" src="js/jquery-1.3.2.js" ></script>
<script type="text/javascript" src="js/ajaxupload.3.5.js" ></script>
<link rel="stylesheet" type="text/css" href="./styles.css" />
<script type="text/javascript" >
	$(function(){
		var btnUpload=$('#upload');
		var status=$('#status');
		new AjaxUpload(btnUpload, {
			action: 'upload-file.php',
			name: 'uploadfile',
			onSubmit: function(file, ext){
				 if (! (ext && /^(jpg|png|jpeg|gif)$/.test(ext))){ 
                    // extension is not allowed 
					status.text('Only JPG, PNG or GIF files are allowed');
					return false;
				}
				status.text('Uploading...');
			},
			onComplete: function(file, response){
				//On completion clear the status
				status.text('');
				//Add uploaded file to list
				if(response==="success"){
					$('<li></li>').appendTo('#files').html('<img src="./uploads/'+file+'" alt="" /><br />'+file).addClass('success');
				} else{
					$('<li></li>').appendTo('#files').text(file).addClass('error');
				}
			}
		});
		
	});
</script>
</head>
<body>
<div id="mainbody" >
		<h3>&raquo; AJAX File Upload Form Using jQuery</h3>
		<!-- Upload Button, use any id you wish-->
		<div id="upload" ><span>Upload File<span></div><span id="status" ></span>
		
		<ul id="files" ></ul>
</div>


V prípade, že dôjde ku kliknutiu na Upload File, sa spúšťa celý proces. Ja by som potreboval modifikovať javascript tak aby sa napriklad funkcia spustila po kliknuti na <a>Odkaz</a> so špecifickým parametrom napr. engine('abc'); teda <a href="#" onClick="javascript: engine('abc');">Upload File</a>.
Vedel by mi prosím niekto poradiť ako upraviť javascript na dosiahutie tohto efektu ? Myšlienke toho JS prevedenia celkom dobre (vôbec) nerozumiem.
_es
Profil
moel:
potreboval by som dynamicky upload-nuť súbory
To máš dáku divnú terminológiu. Obvykle sa pod „uploadnutím“ súboru v prehliadači myslí odoslanie súboru z klientskeho počítača na server, ty naopak načítavaš nejaký obsah zo servera do stránky.

AJAX File Upload Form Using jQuery
Veď tam žiadny formulár nemáš.

Aha, už som pochopil, že tá JS knižnica asi vyrába nejaké dynamické formuláre, ktoré asi hneď skrýva či maže, no akú to má výhodu voči normálnemu formuláru s odosielacím tlačítkom na odoslanie súboru?
pcmanik
Profil
_es:
„AJAX File Upload Form Using jQuery“
Veď tam žiadny formulár nemáš.
Nechytaj za slovicka.

„potreboval by som dynamicky upload-nuť súbory“
To máš dáku divnú terminológiu. Obvykle sa pod „uploadnutím“ súboru v prehliadači myslí odoslanie súboru z klientskeho počítača na server, ty naopak načítavaš nejaký obsah zo servera do stránky.
Ako si na to prisiel ze nieco nacitava? Jedine tak udalost onComplete berie odpoved z toho odoslaneho suboru a to zobrazi v statuse, ale inak to funguje ako uploader.
_es
Profil
pcmanik:
No tak mu poraď, keď máš v tom tak jasno, mne sa skôr zdá, že používa nejakú JS knižnicu a ani nevie prečo a zaobišiel by sa aj bez nej.
moel
Profil *
To je originálny zdrojový kod - ako som písal, len jeho časť. Inak je všetko funkčné, len ja by som ho potreboval upraviť podľa mojich predstáv...čo neviem ako presne dosiahnuť. Po kliknuti na Upload File a označení konkrétneho súboru sa súbor upload-ne na server. Potom dôjde aj k jeho načítaniu do stránky - to je to, čo pozoruješ.
pcmanik
Profil
moel:
Ano, ale mohol by si zrozumitelnejsie napisat, co potrebujes? Moc sa v tom nevyznam a nemozem ti poradit.
_es
Profil
moel:
No a prečo nepoužiješ normálny <input type="file">?
moel
Profil *
_es:
pretože neviem realizovať prevedenie dynamického upload-nutia súborov pomocou ajaxu - štýlom <input type="file"> (formulára). ak vieš o nejakom kompletnom skripte, môžeš ho zverejniť :)
'klasickým' prevedením ajaxu či už get alebo post sa súbory nedajú prenášať, resp skript potrebuje nejaký dodatok naviac...
_es
Profil
moel:
pretože neviem realizovať prevedenie dynamického upload-nutia súborov pomocou ajaxu
Ako definuješ „dynamické uploadnutie súboru pomocou AJAXu“?
Veď musíš aj tak normálne pomocou dialógového okna vybrať súbor z disku.
Súbor ajaxupload.3.5.js aj tak, napriek svojmu názvu, vytvára normálne formuláre a elementy iframe, teda to isté, len okľukou.
moel
Profil *
_es:
k tomu dochádza, ale bez použitia <input type='file'>
neviem presne prečitať ten zdrojový kód.

toto je niečo velmi podobné:
(netreba nič instalovať, ani vytvárat databázu, stačí to celé skopírovať)
Ajax File Upload
_es
Profil
moel:
k tomu dochádza, ale bez použitia <input type='file'>
A ako myslíš, že ten „AJAX upload“ ten súbor odošle?

Stále si nenapísal, v čom konkrétnom má pre teba použitie toho skriptu výhodu, než použitie normálneho odosielacieho poľa <input type="file">.
Witiko
Profil
moel:
AJAX není schopný odesílat binární soubory, odesílání souborů bez reloadu stránky je vyvedeno odesláním souboru přes rámec. Nějak takto:
<form action="./upload.php" method="post" enctype="multipart/form-data" target="ramec">
  <input name="soubor" type="file">
  <input type="submit">
</form>

<iframe name="ramec" style="display: none;"></iframe>
_es
Profil
Witiko:
Alebo ten iframe ani nemusí byť skrytý a má priamo viditeľnú odpoveď zo servera bez akéhokoľvek JS.
Witiko
Profil
_es:
Většinou iframe navrátí html stránku se scriptem, který pomocí window.parent reference informuje RIA o tom, jak to dopadlo. Případně pokud budeme mluvit o futuristech tak za pomoci HTML5 Web Messaging.

Každopádně ano, moelovi by mohl stačit zcela prostý vanilla upload (i bez rámců). Jen nám musí prozradit to delikátní tajemství a sice na co že přesně ten upload potřebuje. :-)

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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