Top-Themen

AppleEntwicklungHardwareInternetLinuxMicrosoftMultimediaNetzwerkeOff TopicSicherheitSonstige SystemeVirtualisierungWeiterbildungZusammenarbeit

Aktuelle Themen

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit

Bei Seitenaufruf Dateiauswahl öffnen - JavaScript

Frage Entwicklung JavaScript

Mitglied: justanumber44

justanumber44 (Level 1) - Jetzt verbinden

21.05.2014, aktualisiert 22:47 Uhr, 2893 Aufrufe, 8 Kommentare

Schönen guten Abend
Ich bräuchte kurz Hilfe bei einem Script das Automatisch beim aufrufen den Auswahl-Dialog für Dateien öffnen soll, das ganze dann hochladen soll und noch mit Statusanzeige (nur im Titel der Seite, wie der rest aussieht ist egal).

Keine sorge ich hab soweit alles bis das Datei auswählen beim Aufruf.
(Bitte nicht erschlagen , ich weiß selbst das das Script der Horror sein muss, ich kenn mich noch nicht wirklich mit JavaScript und jQuery aus)

index.html
01.
<!DOCTYPE html> 
02.
<html> 
03.
<head> 
04.
  <script type='text/javascript' src='//code.jquery.com/jquery-2.0.2.js'></script> 
05.
   
06.
 
07.
<script> 
08.
function _(el){ 
09.
	return document.getElementById(el); 
10.
11.
function uploadFile(){ 
12.
	var file = _("yourinputname").files[0]; 
13.
	//alert(file.name+" | "+file.size+" | "+file.type); 
14.
	var formdata = new FormData(); 
15.
	formdata.append("yourinputname", file); 
16.
	var ajax = new XMLHttpRequest(); 
17.
	ajax.upload.addEventListener("progress", progressHandler, false); 
18.
	ajax.addEventListener("load", completeHandler, false); 
19.
	ajax.addEventListener("error", errorHandler, false); 
20.
	ajax.addEventListener("abort", abortHandler, false); 
21.
	ajax.open("POST", "file_upload_parser.php"); 
22.
	ajax.send(formdata); 
23.
24.
function progressHandler(event){ 
25.
	_("loaded_n_total").innerHTML = "Uploaded "+event.loaded+" bytes of "+event.total; 
26.
	var percent = (event.loaded / event.total) * 100; 
27.
	document.title = percent; 
28.
	_("progressBar").value = Math.round(percent); 
29.
	_("status").innerHTML = Math.round(percent)+"% uploaded... please wait"; 
30.
31.
function completeHandler(event){ 
32.
	_("status").innerHTML = event.target.responseText; 
33.
	_("progressBar").value = 0; 
34.
35.
function errorHandler(event){ 
36.
	_("status").innerHTML = "Upload Failed"; 
37.
38.
function abortHandler(event){ 
39.
	_("status").innerHTML = "Upload Aborted"; 
40.
41.
 
42.
</script> 
43.
</head> 
44.
 
45.
<body> 
46.
 
47.
 
48.
<script type='text/javascript'> 
49.
$(function(){ 
50.
    $('#id').on('click', function() { 
51.
        $('#yourinputname').trigger('click'); 
52.
    }); 
53.
});//]]>   
54.
 
55.
</script> 
56.
 
57.
 
58.
</head> 
59.
<body> 
60.
  <button id="id">Open</button> 
61.
  <form id="upload_form" enctype="multipart/form-data" method="post"> 
62.
<input id="yourinputname" type="file" name="yourinputname" onchange="uploadFile()" /> 
63.
    <progress id="progressBar" value="0" max="100" style="width:300px;"></progress> 
64.
  <h3 id="status"></h3> 
65.
  <p id="loaded_n_total"></p> 
66.
</form> 
67.
</body> 
68.
</html>
file_upload_parser.php
01.
<?php 
02.
$fileName = $_FILES["yourinputname"]["name"]; // The file name 
03.
$fileTmpLoc = $_FILES["yourinputname"]["tmp_name"]; // File in the PHP tmp folder 
04.
$fileType = $_FILES["yourinputname"]["type"]; // The type of file it is 
05.
$fileSize = $_FILES["yourinputname"]["size"]; // File size in bytes 
06.
$fileErrorMsg = $_FILES["yourinputname"]["error"]; // 0 for false... and 1 for true 
07.
if (!$fileTmpLoc) { // if file not chosen 
08.
    echo "ERROR: Please browse for a file before clicking the upload button."; 
09.
    exit(); 
10.
11.
if(move_uploaded_file($fileTmpLoc, "test_uploads/$fileName")){ 
12.
    echo "$fileName upload is complete"; 
13.
} else { 
14.
    echo "move_uploaded_file function failed"; 
15.
16.
?>
Ich hoffe ihr könnt mir helfen
mfg Jonas
Mitglied: colinardo
22.05.2014, aktualisiert um 10:17 Uhr
Hallo Jonas,
für einen Aufruf des Dateiauswahldialogs beim Aufruf der Seite müsste das reichen:
01.
$(document).ready(function(e) { 
02.
    $('#yourinputname').trigger('click'); 
03.
});
Grüße Uwe
Bitte warten ..
Mitglied: justanumber44
22.05.2014, aktualisiert um 16:47 Uhr
Leider nicht -.-
01.
<!DOCTYPE html> 
02.
<html> 
03.
<head> 
04.
  <script type='text/javascript' src='//code.jquery.com/jquery-2.0.2.js'></script> 
05.
   
06.
 
07.
<script> 
08.
$(document).ready(function(e) { 
09.
    $('#yourinputname').trigger('click'); 
10.
}); 
11.
function _(el){ 
12.
	return document.getElementById(el); 
13.
14.
function uploadFile(){ 
15.
	var file = _("yourinputname").files[0]; 
16.
	//alert(file.name+" | "+file.size+" | "+file.type); 
17.
	var formdata = new FormData(); 
18.
	formdata.append("yourinputname", file); 
19.
	var ajax = new XMLHttpRequest(); 
20.
	ajax.upload.addEventListener("progress", progressHandler, false); 
21.
	ajax.addEventListener("load", completeHandler, false); 
22.
	ajax.addEventListener("error", errorHandler, false); 
23.
	ajax.addEventListener("abort", abortHandler, false); 
24.
	ajax.open("POST", "file_upload_parser.php"); 
25.
	ajax.send(formdata); 
26.
27.
function progressHandler(event){ 
28.
	_("loaded_n_total").innerHTML = "Uploaded "+event.loaded+" bytes of "+event.total; 
29.
	var percent = (event.loaded / event.total) * 100; 
30.
	document.title = percent; 
31.
	_("progressBar").value = Math.round(percent); 
32.
	_("status").innerHTML = Math.round(percent)+"% uploaded... please wait"; 
33.
34.
function completeHandler(event){ 
35.
	_("status").innerHTML = event.target.responseText; 
36.
	_("progressBar").value = 0; 
37.
38.
function errorHandler(event){ 
39.
	_("status").innerHTML = "Upload Failed"; 
40.
41.
function abortHandler(event){ 
42.
	_("status").innerHTML = "Upload Aborted"; 
43.
44.
 
45.
</script> 
46.
</head> 
47.
 
48.
<body> 
49.
 
50.
 
51.
<script type='text/javascript'> 
52.
  
53.
 
54.
</script> 
55.
 
56.
 
57.
</head> 
58.
<body> 
59.
  <button id="id">Open</button> 
60.
  <form id="upload_form" enctype="multipart/form-data" method="post"> 
61.
<input id="yourinputname" type="file" name="yourinputname" onchange="uploadFile()" /> 
62.
    <progress id="progressBar" value="0" max="100" style="width:300px;"></progress> 
63.
  <h3 id="status"></h3> 
64.
  <p id="loaded_n_total"></p> 
65.
</form> 
66.
</body> 
67.
 
68.
 
69.
</html> 
70.
 
Bitte warten ..
Mitglied: colinardo
22.05.2014, aktualisiert um 17:35 Uhr
also bei mir geht das öffnen des Dialogs ... vorhin mit Firefox getestet, oder willst du das eine Datei automatisch ausgewählt wird ?

Hast du einen Popupblocker aktiv ? Der wird dabei normalerweise getriggert.
Bitte warten ..
Mitglied: justanumber44
22.05.2014, aktualisiert um 20:59 Uhr
Zitat von colinardo:

also bei mir geht das öffnen des Dialogs ... vorhin mit Firefox getestet, oder willst du das eine Datei automatisch
ausgewählt wird ?

Hast du einen Popupblocker aktiv ? Der wird dabei normalerweise getriggert.

Adblocker und Popup blocker im Chrome :D Ich habs aber mit Nightly (Firefox 64x) versucht, ging nicht.
Bitte warten ..
Mitglied: colinardo
22.05.2014, aktualisiert um 21:47 Uhr
öhm jetzt wo ih mir deinen Code mal näher ansehe ist doch einiges unstimmig, hier fehlt dir z.B. das http:
01.
<script type='text/javascript' src='//code.jquery.com/jquery-2.0.2.js'></script>
und in deinem HTML-Code ist auch einiges doppelt gemoppelt (doppelter Head und doppelter Body) !

Mal auf die wesentliche Funktion um die es hier geht reduziert, geht das einwandfrei ...
01.
<!DOCTYPE html> 
02.
<html> 
03.
<head> 
04.
  <script type='text/javascript' src='http://code.jquery.com/jquery-2.0.2.js'></script> 
05.
<script> 
06.
$(document).ready(function(e) { 
07.
    $('#yourinputname').trigger('click'); 
08.
}); 
09.
</script> 
10.
</head> 
11.
<body> 
12.
<input id="yourinputname" type="file" name="yourinputname" /> 
13.
</body> 
14.
</html>
Bitte warten ..
Mitglied: justanumber44
22.05.2014 um 22:09 Uhr
Zitat von colinardo:

öhm jetzt wo ih mir deinen Code mal näher ansehe ist doch einiges unstimmig, hier fehlt dir z.B. das http:
01.
> <script type='text/javascript' src='//code.jquery.com/jquery-2.0.2.js'></script> 
02.
> 
und in deinem HTML-Code ist auch einiges doppelt gemoppelt (doppelter Head und doppelter Body) !

Mal auf die wesentliche Funktion um die es hier geht reduziert, geht das einwandfrei ...
01.
> <!DOCTYPE html> 
02.
> <html> 
03.
> <head> 
04.
>   <script type='text/javascript' src='http://code.jquery.com/jquery-2.0.2.js'></script> 
05.
> <script> 
06.
> $(document).ready(function(e) { 
07.
>     $('#yourinputname').trigger('click'); 
08.
> }); 
09.
> </script> 
10.
> </head> 
11.
> <body> 
12.
> <input id="yourinputname" type="file" name="yourinputname" /> 
13.
> </body> 
14.
> </html> 
15.
> 

Auf keinem der Computer, in keinem Browser (Nightly, Chrome, Safari)... (auch nicht am Handy)
document ready geht übrings so schon, ich habe es mit einer simplen Textausgabe versucht, aber er öffnet es einfach nicht
Aber herzlichen Dank für deine Hilfe...
Bitte warten ..
Mitglied: colinardo
22.05.2014, aktualisiert um 22:26 Uhr
dann stimmt bei dir was nicht oder du kopierst den code nicht über Quelltext, hier geht es überall, ich kann dir gerne morgen ein Video schicken, egal ob Firefox, IE unter Windows oder der IE auf einem RT-Tablet. Ich bin ja nicht besch...

Naja dann noch viel Erfolg
Grüße Uwe
Bitte warten ..
Mitglied: 114757
29.05.2014, aktualisiert um 15:15 Uhr
Servus,
also bei mir geht der Code von @colinardo auch problemlos.

Gruß jodel32
Bitte warten ..
Ähnliche Inhalte
Microsoft Office
Word 2010 braucht über 5 Min. um Datei über Netzwerk zu öffnen (4)

Frage von Santhan zum Thema Microsoft Office ...

Webbrowser
gelöst Lokale Links (laufwerklinks) öffnen Firefox

Frage von KEFHVDI zum Thema Webbrowser ...

Outlook & Mail
Temporäres Öffnen von Outlook Anhängen per Schnelldruck (5)

Frage von Denyo25 zum Thema Outlook & Mail ...

Exchange Server
Kalenderfreigabe Outlook 2016 unter 2007 öffnen (1)

Frage von a.grothe zum Thema Exchange Server ...

Neue Wissensbeiträge
Batch & Shell

Batch - ein paar Basics die man kennen sollte

Tipp von Pedant zum Thema Batch & Shell ...

Microsoft

Restrictor: Profi-Schutz für jedes Window

(6)

Tipp von AlFalcone zum Thema Microsoft ...

Batch & Shell

Batch zum Zurücksetzen eines lokalen Profils

Tipp von Mr.Error zum Thema Batch & Shell ...

Heiß diskutierte Inhalte
Batch & Shell
gelöst Gruppenzugehörigkeit von AD Usern ermitteln - die Perfektion fehlt (11)

Frage von Stefan007 zum Thema Batch & Shell ...

LAN, WAN, Wireless
gelöst Netzwerk in 2 Teile trennen (11)

Frage von pattex zum Thema LAN, WAN, Wireless ...

Windows Server
Benutzer lässt sich nur an einem Clientcomputer anmelden (11)

Frage von Ammann zum Thema Windows Server ...

Netzwerke
SFP Modul (miniGibic) (10)

Frage von apranet zum Thema Netzwerke ...