Ajax Upload

Status
Nicht offen für weitere Antworten.
okay die erste frage wäre: Wie bekomm ich die Upload Box von Windows zu sehen, wenn ich einen Button drück.

Dann wie schick ich die ausgewählte Datei an mein PHP Script, genau weiß ich es selber nicht, mus nur das Grundprinzip verstehen dann versteh ich auch den rest :)
 
Vielleicht solltest du erstmal schauen, wie ein Upload grundsätzlich (ohne AJAX) funktioniert: Felder für Datei-Upload definieren

Im action-Attribut des <form>-Tags gibst du dein PHP-Script als Adressat an.

In deiner eingangs verlinkten Demo-Seite wird das Formular mit dem <input type="file">-Element durch jQuery erzeugt.

mfg Maik
 
Habe mir alles durchgelesen, dort steht nur das was ich selber schon wuste, oder siehst du da eine möglichkeit einen eigenen Button zu erstellen ? :-)
Edit:
jQuery ? ist das nicht eine Javascript Klasse ?
 
Wenn du das alles schon gelesen hast, warum weißt du dann nicht, wie die Daten zu deinem PHP-Script gelangen?

Wenn dir die Zusammenhänge soweit auch klar sind, sollte eigentlich die Analyse des HTML- und JS-Codes deiner eingangs genannten Seite die Frage beantworten, wie der linke Upload-Button (#button1, example 1 = Beispiel 1) umgesetzt wurde, und die Daten zum PHP-Script gelangen:
Javascript:
/* example 1 */
	var button = $('#button1'), interval;
	new AjaxUpload(button,{
		//action: 'upload-test.php', // Ist aus Sicherheitsgründen vom Autor in diesem Beispiel deaktiviert
		action: 'upload.htm', 
		name: 'myfile',
		onSubmit : function(file, ext){
			// change button text, when user selects file			
			button.text('Uploading');
			
			// If you want to allow uploading only 1 file at time,
			// you can disable upload button
			this.disable();
			
			// Uploding -> Uploading. -> Uploading...
			interval = window.setInterval(function(){
				var text = button.text();
				if (text.length < 13){
					button.text(text + '.');					
				} else {
					button.text('Uploading');				
				}
			}, 200);
		},
		onComplete: function(file, response){
			button.text('Upload');
						
			window.clearInterval(interval);
						
			// enable upload button
			this.enable();
			
			// add file to the list
			$('<li></li>').appendTo('#example1 .files').text(file);						
		}
	});
HTML:
<div id="button1" class="button">Upload</div>


mfg Maik
 
Okay glaube so langsam verstehe ich den Code :) war mir einfach zu viel als ich auf Download geklickt hab und da ein ganzes Fussball Feld mit Code kam :(

Danke Maik für deine hilfe werde mir mal den Code jetzt in ruhe anschauen:)
 
In dem Script "ajaxupload.3.5.js" brauchst du eigentlich keine Hand anlegen, es sei denn, du willst es auf ein anderes HTML-Element, wie das <div>, anwenden:

Javascript:
/**
 * Creates and returns element from html chunk
 */
var toElement = function(){
        var div = d.createElement('div');
        return function(html){
                div.innerHTML = html;
                var el = div.childNodes[0];
                div.removeChild(el);
                return el;
        }
}();

mfg Maik
 
Wollte schon gerne Hand anlegen, will das erstmal komplett lernen, und dann ohne anleitung selber coden, will später die ganze Seite in Ajax haben :D

Aber gut dann weiß ich jetzt schon mal wo der Code für den Div ist :D
ich versuchs mal grade nach zu bauen sag dir gleich bescheid ob es geklappt hat :)
 
Das Beispiel greift auf das jquary framework zurück das will ich aber nicht haben, brauche also doch noch hilfe.

könnte mir das ganze beispiel mal jemand schritt für schritt erklären ? (ohne jquery)

gruß.turnx
 
Status
Nicht offen für weitere Antworten.
Zurück