Top-Themen

Aktuelle Themen (A bis Z)

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

Mitglied: justanumber44

justanumber44 (Level 1) - Jetzt verbinden

21.05.2014, aktualisiert 22:47 Uhr, 3144 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
Batch & Shell
Dateiauswahl mit dialog
Frage von lasterBatch & Shell

Hallo, ich will ein Dateiauswahldialog (Linux Shell) mit dialog (Version 1.1-20120215) verwenden. Die Funktion fselect ist ja nicht wirklich ...

Apache Server
JavaScript wird nicht ausgeführt
Frage von schneerunzelApache Server

Hallo zusammen ich wollte gerade das Tool open3A installieren. Dabei bekomme ich einen Fehler die Dateien sind alle mit ...

JavaScript
Javascript Array
gelöst Frage von internet2107JavaScript2 Kommentare

Ich habe folgendes Problem. Ersetze ich die folgenden Zahlen gegen Variablenwerte, bekomme ich nicht das Ergebnis, wie mit festen ...

JavaScript
Javascript Funktionen
gelöst Frage von agowa338JavaScript5 Kommentare

Hallo, habe gerade mehrere schönen Javascripte per mail bekommen und frage mich gerade, was eigentlich folgendes in einem Javascript ...

Neue Wissensbeiträge
Humor (lol)

WhatsApp-Nachrichten endlich auch per Bluetooth versendbar

Information von BassFishFox vor 14 StundenHumor (lol)3 Kommentare

Genau darauf habe ich gewartet! ;-) Der beliebte Messaging-Dienst WhatsApp erhält eine praktische neue Funktion: Ab dem nächsten Update ...

Google Android

Googles "Android Enterprise Recommended" für Unternehmen

Information von kgborn vor 1 TagGoogle Android3 Kommentare

Hier eine Information, die für Administratoren und Verantwortliche in Unternehmen, die für die Beschaffung und das Rollout von Android-Geräten ...

Sicherheit

Intel gibt neue Spectre V2-Microcode-Updates frei (20.02.2018)

Information von kgborn vor 1 TagSicherheit

Intel hat zum 20. Februar 2018 weitere Microcode-Updates für OEMs freigegeben, um Systeme mit neueren Prozessoren gegen die Spectre ...

Microsoft
ARD-Doku - Das Microsoft Dilemma
Tipp von Knorkator vor 1 TagMicrosoft3 Kommentare

Hallo zusammen, vor einigen Tagen lief in der ARD u.a. Reportage. Das Youtube Video dazu dürfte länger verfügbar sein. ...

Heiß diskutierte Inhalte
Server-Hardware
Welche Rolle spielt Design bei Enterprise IT Hardware?
Frage von ApolloXServer-Hardware16 Kommentare

Ich arbeite für einen internationalen Elektronikhersteller in der Forschung und meine Aufgabe ist es, Feedback von Nutzern in Hinsicht ...

Windows Netzwerk
WSUS4 und Windows 10 Updates automatisch installieren
Frage von sammy65Windows Netzwerk15 Kommentare

Hallo miteinander, ich habe mit einen neuen WSUS Server aufgesetzt Server 2016 darauf einen aktuellen WSUS. Grund, wir stellen ...

Switche und Hubs
Cisco SG350X-48 AdminIP in anderes VLAN
Frage von lcer00Switche und Hubs14 Kommentare

Hallo zusammen, ich habe ein Problem mir einem Cisco SG350X-48 bei der Erstinstallation wurde eine IP 192.168.0.254 (Default VLAN ...

Windows Netzwerk
Backup über WAN
Frage von petereWindows Netzwerk11 Kommentare

Hallo, ich muss aus einem entfernten WAN (synchrone 1Gbit) Daten sichern. Dabei handelt es sich sowohl um wenige große ...