Embed Size (px)
Citation preview
|
Dateien per Drag & Drop in Apex Applikationen ablegenDOAG Konferenz 2014 (Nürnberg)
Franziska Höcker
Nürnberg, 20.11.20141
||
Agenda
DOAG Konferenz 20142
1. Vorstellung MT AG
2. Das Ergebnis – Live Demo
3. Die Umsetzung
4. Individualisierungsmöglichkeiten
5. Fazit
6. MT AG Fachvorträge
||
1. Vorstellung der MT AG
DOAG Konferenz 20143
|
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
DOAG Konferenz 20144
|
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
DOAG Konferenz 20145
|
UNSER PORTFOLIO
business by integration
BUSINESS
INTELLIGENCE SOLUTIONSSOCIAL BUSINESS
SOLUTIONSMOBILE
SOLUTIONS
APPLICATION
DEVELOPMENTINTEGRATION
SERVICESIT 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
DOAG Konferenz 20146
||
2. Das Ergebnis – Live Demo
Doag 20147
|
Ziel & Zweck einer Dropzone
Ziel:
Erstellen einer Dropzone
Dropzone.js
Zweck:
Schneller & Effizienter
Gleichzeitiger Upload mehrerer Dateien
klicken & hereinziehen
Ergonomisch
Information über Upload
Doag 20148
||
3. Die Umsetzung
Doag 20149
|
Die Umsetzung
http://www.dropzonejs.com/
Static File Apex Workspace
Einbinden der Bibliothek:
Doag 201410
<script type="text/javascript" src="#APP_IMAGES#dropzone.js"></script>
Einbinden der Bibliothek Dropzone.js
|
Die Umsetzung
Doag 201411
Erstellen eines DIV für die Dropzone
|
Die Umsetzung
Doag 201412
Programmatisches Erstellen der Dropzone
fDZS = new Dropzone('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()}
});
|
Die Umsetzung
Doag 201413
Post Prozess File Browse Item
|
Die Umsetzung
Doag 201414
Weitere Parameter für Post Prozess
Programmatisches Erstellen der Dropzone
fDZS.options.paramName = vArgName;
var vArgName = $('#P4_FILEUPLOAD').attr('name');
var vArgNameEnc =
$('#P4_FILEUPLOAD').prev('input[type="hidden"][name="p_arg_names"]').val();
fDZS.on('sending',function(file, xhr, formData) {formData.append("p_arg_names",vArgNameEnc);
});
||
Livedemo
Doag 201415
|
Die Umsetzung
Doag 201416
Individuelle Speicherung der Daten
Hidden Item (P4_FILENAMES)
Funktion getFileNames (JavaScript)
Ajax Call (PL/SQL)
fDZS.on('success',function(a,response){getFilenames();var ajaxCall = new htmldb_Get(null, &APP_ID.,'APPLICATION_PROCESS=PROCESS_UPLOADED_FILES', &APP_PAGE_ID.);ajaxCall.add('P4_FILENAMES', $(P4_FILENAMES).val());});
|
Die Umsetzung
Doag 201417
Layout Anpassungen
Dropzone.css & Spritemap.png & [email protected]
Dropzone Klasse direkt für DIV setzen
Fehler „Dropzone schon vorhanden“
Dropzone.options.dropzone = false;
||
Livedemo
Doag 201418
||
4. Individualisierungsmöglichkeiten
DOAG Konferenz 201419
|
Weitere Möglichkeiten der Individualisierung
Beispiele:
Löschen der Dateien aus Dropzone nach direktem Upload
Löschen der Datei aus Dropzone bei 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
Thumbnail Anzeige für verschiedene Dateitypen
Doag 201420
||
Livedemo
Doag 201421
||
5. Fazit
Doag 201422
|
Fazit
Hilfreich
Sinnvoll
Individualisierbar
Effizient
Kenntnisse mit Apex, JavaScript vorraussgesetzt
Doag 201423
| DOAG Konferenz 201424
6. ALLE VORTRÄGE
| DOAG Konferenz 201425
15:00 - 15:45
Sydney
Datenmodellierung ist langweilig,
lassen Sie Datamodeler das machen
Oleg
Kiriltsev18.11.14
12:00 - 12:45
Sydney
Das nächste Duet(t):
APEX und SAP.
Niels de
Bruijn19.11.14
16:00 - 16:45
Singapur
Speichersparende XML Verarbeitung
mit StAX und JAXB
Wolfgang
Nast19.11.14
16:00 - 16:45
Istanbul
"Echtes" Single Sign On
mit APEX realisieren.
Niels de
Bruijn19.11.14
09:00 - 09:45
Sydney Five Fingers Death Punch
Oliver
Lemm20.11.14
10:00 - 10:45
Helsinki
12c Oracle Warehousing voll Groovy.
Ein Projektbericht.Rosenberger
Ketteltasche20.11.14
12:00 - 12:45
Istanbul
Dateien per Drag & Drop in APEX
Applikationen ablegen
Franziska
Höcker20.11.14
15:00 - 15:45
Oslo Ist Gradle auch für die APEX-Projekte?
Oleg
Kiriltsev20.11.14
15:00 - 15:45
Istanbul Tune Up Your APEX
Oliver
Lemm20.11.14
|
Telefon:
Telefax:
E-Mail:
www.mt-ag.com
Vielen Dank…
Beraterin Oracle Application Express
+49 2102 30961 -0
+49 2102 30961 -101
Franziska Höcker
