| 
Dateien per Drag & Drop in Apex Applikationen ablegen 
DOAG Konferenz 2014 (Nürnberg) 
Franziska Höcker 
Nürnberg, 20.1...
| 
Agenda 
2 DOAG Konferenz 2014 
1.Vorstellung MT AG 
2.Das Ergebnis –Live Demo 
3.Die Umsetzung 
4.Individualisierungsmö...
| 
1. Vorstellung der MT AG 
3 DOAG Konferenz 2014
| 
Maßgeschneiderte & zukunftssichere IT-Lösungen 
WIR STEIGERN DIE LEISTUNGS-SOWIE WETTBEWERBSFÄHIGKEIT UNSERER KUNDEN. 
...
| 
FACTS & FIGURES 
GESCHÄFTSFORM 
INHABERGEFÜHRTE AG 
HAUPTSITZ 
RATINGEN 
GRÜNDUNGSJAHR 
1994 
BESCHÄFTIGTE 
180 FESTANG...
| 
UNSER PORTFOLIO 
business by integration 
BUSINESSINTELLIGENCESOLUTIONS 
SOCIAL BUSINESS SOLUTIONS 
MOBILE 
SOLUTIONS 
...
| 
2. Das Ergebnis –Live Demo 
7 Doag 2014
| 
Ziel & Zweck einer Dropzone 
Ziel: 
Erstellen einer Dropzone 
Dropzone.js 
Zweck: 
Schneller & Effizienter 
Gleichz...
| 
3. Die Umsetzung 
9 Doag 2014
| 
Die Umsetzung 
http://www.dropzonejs.com/ 
StaticFile Apex Workspace 
Einbinden der Bibliothek: 
10 Doag 2014 
<scri...
| 
Die Umsetzung 
11 Doag 2014 
Erstellen eines DIV für die Dropzone
| 
Die Umsetzung 
12 Doag 2014 
Programmatisches Erstellen der Dropzone 
fDZS= newDropzone('div#dropzone',{ 
"url": "wwv_f...
| 
Die Umsetzung 
13 Doag 2014 
Post Prozess File Browse Item
| 
Die Umsetzung 
14 Doag 2014 
Weitere Parameter für Post Prozess 
Programmatisches Erstellen der Dropzone 
fDZS.options....
| 
Livedemo 
15 Doag 2014
| 
Die Umsetzung 
16 Doag 2014 
Individuelle Speicherung der Daten 
Hidden Item (P4_FILENAMES) 
Funktion getFileNames(Ja...
| 
Die Umsetzung 
17 Doag 2014 
Layout Anpassungen 
Dropzone.css & Spritemap.png & Spritemap@2x.png 
DropzoneKlasse dire...
| 
Livedemo 
18 Doag 2014
| 
4. Individualisierungsmöglichkeiten 
19 DOAG Konferenz 2014
| 
Weitere Möglichkeiten der Individualisierung 
Beispiele: 
Löschen der Dateien aus Dropzonenach direktem Upload 
Lösch...
| 
Livedemo 
21 Doag 2014
| 
5. Fazit 
22 Doag 2014
| 
Fazit 
Hilfreich 
Sinnvoll 
Individualisierbar 
Effizient 
Kenntnisse mit Apex, JavaScript vorraussgesetzt 
23 Doa...
| DOAG Konferenz 2014 24 
6. ALLE VORTRÄGE
| DOAG Konferenz 2014 25 
15:00 -15:45 Sydney 
Datenmodellierung ist langweilig, lassen Sie Datamodelerdas machen 
Oleg 
K...
| 
Telefon: Telefax: 
E-Mail: 
www.mt-ag.com 
Vielen Dank… 
Beraterin Oracle ApplicationExpress 
+49 2102 30961 -0 
+49 21...
Nächste SlideShare
Wird geladen in …5
×

Dateien per Drag & Drop in APEX Applikationen ablegen.

503 Aufrufe

Veröffentlicht am

Dateien per Drag & Drop in APEX Applikationen ablegen.

Veröffentlicht in: Technologie
0 Kommentare
0 Gefällt mir
Statistik
Notizen
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Keine Downloads
Aufrufe
Aufrufe insgesamt
503
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
3
Aktionen
Geteilt
0
Downloads
3
Kommentare
0
Gefällt mir
0
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie

Dateien per Drag & Drop in APEX Applikationen ablegen.

  1. 1. | Dateien per Drag & Drop in Apex Applikationen ablegen DOAG Konferenz 2014 (Nürnberg) Franziska Höcker Nürnberg, 20.11.2014 1
  2. 2. | Agenda 2 DOAG Konferenz 2014 1.Vorstellung MT AG 2.Das Ergebnis –Live Demo 3.Die Umsetzung 4.Individualisierungsmöglichkeiten 5.Fazit 6.MT AG Fachvorträge
  3. 3. | 1. Vorstellung der MT AG 3 DOAG Konferenz 2014
  4. 4. | Maßgeschneiderte & zukunftssichere IT-Lösungen WIR STEIGERN DIE LEISTUNGS-SOWIE WETTBEWERBSFÄHIGKEIT UNSERER KUNDEN. DURCH SERVICE, BERATUNG UND UMSETZUNG. WIR VERBINDEN DIE AGILITÄT EINES MITTEL- STÄNDISCHEN UNTER- NEHMENS MIT DER LÖSUNGSKOMPETENZ GROSSER BERATUNGS- HÄUSER. business by integration 4 DOAG Konferenz 2014
  5. 5. | FACTS & FIGURES GESCHÄFTSFORM INHABERGEFÜHRTE AG HAUPTSITZ RATINGEN GRÜNDUNGSJAHR 1994 BESCHÄFTIGTE 180 FESTANGESTELLTE MITARBEITER BETEILIGUNGEN MT-IFS GMBH (RATINGEN), MT-IFS SARL (LUXEMBURG) business by integration 5 DOAG Konferenz 2014
  6. 6. | UNSER PORTFOLIO business by integration BUSINESSINTELLIGENCESOLUTIONS SOCIAL BUSINESS SOLUTIONS MOBILE SOLUTIONS APPLICATIONDEVELOPMENT INTEGRATION SERVICES IT SYSTEM SERVICES AGILE BI SELF SERVICE BI MOBILE BI COLLABORATION SEARCH SOCIAL APPS ABLÄUFE LOKALISIERUNG APEX / ADF JAVA .NET STRATEGIE ARCHITEKTUR SAP HANA BETRIEB BACKUP RECOVERY MIGRATION 6 DOAG Konferenz 2014
  7. 7. | 2. Das Ergebnis –Live Demo 7 Doag 2014
  8. 8. | Ziel & Zweck einer Dropzone Ziel: Erstellen einer Dropzone Dropzone.js Zweck: Schneller & Effizienter Gleichzeitiger Upload mehrerer Dateien klicken & hereinziehen Ergonomisch Information über Upload 8 Doag 2014
  9. 9. | 3. Die Umsetzung 9 Doag 2014
  10. 10. | Die Umsetzung http://www.dropzonejs.com/ StaticFile Apex Workspace Einbinden der Bibliothek: 10 Doag 2014 <scripttype="text/javascript" src="#APP_IMAGES#dropzone.js"></script> Einbinden der Bibliothek Dropzone.js
  11. 11. | Die Umsetzung 11 Doag 2014 Erstellen eines DIV für die Dropzone
  12. 12. | Die Umsetzung 12 Doag 2014 Programmatisches Erstellen der Dropzone fDZS= newDropzone('div#dropzone',{ "url": "wwv_flow.accept", "params": { "p_instance":$('#pInstance').val(), "p_flow_id":$('#pFlowId').val(), "p_flow_step_id":$('#pFlowStepId').val(), "p_page_checksum":$('#pPageChecksum').val(), "p_page_submission_id":$('#pPageSubmissionId').val() } });
  13. 13. | Die Umsetzung 13 Doag 2014 Post Prozess File Browse Item
  14. 14. | Die Umsetzung 14 Doag 2014 Weitere Parameter für Post Prozess Programmatisches Erstellen der Dropzone fDZS.options.paramName= vArgName; varvArgName= $('#P4_FILEUPLOAD').attr('name'); varvArgNameEnc= $('#P4_FILEUPLOAD').prev('input[type="hidden"][name="p_arg_names"]').val(); fDZS.on('sending',function(file, xhr, formData) { formData.append("p_arg_names",vArgNameEnc); });
  15. 15. | Livedemo 15 Doag 2014
  16. 16. | Die Umsetzung 16 Doag 2014 Individuelle Speicherung der Daten Hidden Item (P4_FILENAMES) Funktion getFileNames(JavaScript) Ajax Call (PL/SQL) fDZS.on('success',function(a,response){ getFilenames(); varajaxCall= newhtmldb_Get(null, &APP_ID., 'APPLICATION_PROCESS=PROCESS_UPLOADED_FILES', &APP_PAGE_ID.); ajaxCall.add('P4_FILENAMES', $(P4_FILENAMES).val()); });
  17. 17. | Die Umsetzung 17 Doag 2014 Layout Anpassungen Dropzone.css & Spritemap.png & Spritemap@2x.png DropzoneKlasse direkt für DIV setzen Fehler „Dropzoneschon vorhanden“ Dropzone.options.dropzone= false;
  18. 18. | Livedemo 18 Doag 2014
  19. 19. | 4. Individualisierungsmöglichkeiten 19 DOAG Konferenz 2014
  20. 20. | Weitere Möglichkeiten der Individualisierung Beispiele: Löschen der Dateien aus Dropzonenach direktem Upload Löschen der Datei aus Dropzonebei Klick auf die Datei maximale Größe für Dateien maximale Anzahl an Dateien gleichzeitiger Upload von Dateien oder nacheinander Remove Link anzeigen zum entfernen der Datei aus Dropzone ThumbnailAnzeige für verschiedene Dateitypen 20 Doag 2014
  21. 21. | Livedemo 21 Doag 2014
  22. 22. | 5. Fazit 22 Doag 2014
  23. 23. | Fazit Hilfreich Sinnvoll Individualisierbar Effizient Kenntnisse mit Apex, JavaScript vorraussgesetzt 23 Doag 2014
  24. 24. | DOAG Konferenz 2014 24 6. ALLE VORTRÄGE
  25. 25. | DOAG Konferenz 2014 25 15:00 -15:45 Sydney Datenmodellierung ist langweilig, lassen Sie Datamodelerdas machen Oleg Kiriltsev 18.11.14 12:00 -12:45 Sydney Das nächste Duet(t): APEX und SAP. Niels de Bruijn 19.11.14 16:00 -16:45 Singapur Speichersparende XML Verarbeitungmit StAXund JAXB WolfgangNast 19.11.14 16:00 -16:45 Istanbul "Echtes" Single Sign On mit APEX realisieren. Niels de Bruijn 19.11.14 09:00 -09:45 Sydney FiveFingers Death Punch Oliver Lemm 20.11.14 10:00 -10:45 Helsinki 12c Oracle Warehousing voll Groovy. Ein Projektbericht. Rosenberger Ketteltasche 20.11.14 12:00 -12:45 Istanbul Dateien per Drag & Drop in APEX Applikationen ablegen FranziskaHöcker 20.11.14 15:00 -15:45 Oslo Ist Gradleauch für die APEX-Projekte? Oleg Kiriltsev 20.11.14 15:00 -15:45 Istanbul Tune Up YourAPEX Oliver Lemm 20.11.14
  26. 26. | Telefon: Telefax: E-Mail: www.mt-ag.com Vielen Dank… Beraterin Oracle ApplicationExpress +49 2102 30961 -0 +49 2102 30961 -101 Franziska.hoecker@mt-ag.com Franziska Höcker

×