Upload in DialogBox (jQuery UI, sprich via XMLHTTP Request)

dreamcatcher · 15.12.2011, 08:28

Hallo,

ich habe eine jQuery Dialogbox.

Alle Elemente daraus gehe ich automatisch via .serialize() durch und übergebe diese dann an meine mail.php.

Die mail.php verschickt eine Mail mit den Daten und speichert die Daten in einer DB.

Nun setzt die DialogBox (Beispiel: http://jqueryui.com/demos/dialog/modal.html) einen XMLHTTP Request ab, sprich postet die Daten über .post().

Da ein Fileupload, wie schon mehrfach im Web nun gelesen, darüber (Ajax request) nicht möglich ist, gibt es die Möglichkeit via hidden frames.

Nun wird meine Dialogbox zum Versand von Bewerbungsdaten genutzt, sprich ich habe das Problem, dass ich eine vorher (vor dem Abschicken aller Daten) hochgeladene Datei nicht mehr zuordnen kann.

Ich möchte, dass alle (!) Daten gleichzeitig gepostet werden, damit diese dann in einer Mail herausgehen und einmal in der DB gespeichert werden.

Alles andere macht den Vorgang unnötig kompliziert !?

Meine Frage:

Wie realisiert man eine DialogBox, die sowohl alle Felder als auch einen Dateiupload in einem Request posted? Das Ziel ist, die Datei als auch die Benutzerdaten gleichzeitig verarbeiten zu können.

Bzw. wenn das technisch nicht möglich ist, dann die Frage, wie würdet ihr die geuploadete Datei, welche geuploadet werden muss bevor alle Daten gesendet werden kennzeichnen, damit diese am Ende dem Bewerben zuzuordnen ist ?

Datei mit IP in die DB und beim absenden der Daten einen IP Check machen ?

Aktuelles Beispiel:

index.php

PHP-Code:

          /**
         * Dialog "Arbeitgeber anschreiben"
         * 
         */
        $('#modalWindow_contactAdvertiser').dialog({
            autoOpen: false,
            modal: true,
            height: '570', 
            width: '525',
            //Favorites: fold & puff & scale
            show: 'fold',
            hide: 'fold',
            buttons: { 
                "Send E-Mail": function(){

                    //Custom closure for $.post function()
                    var thisDialog = this;

                    //Ajax $.post requerst || serialize = grab all form elements
                    $.post( "./mail.php",
                    $('#contactAdvertiser').serialize(), 
                    [...]
            }
        });

        //Open Event handler
        $('.openModal_contactAdvertiser').click(function(){
            $('#modalWindow_contactAdvertiser').dialog('open');
            return false;
        });


[...]

    <!-- HiddenModalDialog_contactAdvertiser -->
    <div id="modalWindow_contactAdvertiser" title="Arbeitgeber anschreiben" style="display:none">
        <form id="contactAdvertiser">
         <!-- Applicantformular -->
            <fieldset style="border: none;">
                <label for="attachment1">Attachment (Anschreiben & Lebenslauf):</label>
                <input type="file" name="attachment1" id="attachment1"/>
            </fieldset>             
         <!-- End Applicantformular -->
        </form>
    </div>
    <!-- End of HiddenModalDialog_contactAdvertiser -->

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
jQueryLog new extension for debugging jquery (feedback request)	jquerylog	JavaScript, Ajax und mehr	8	26.12.2011 11:58
Läuft der Ajax Request weiter auch wenn der Browser geschlossen wird?	<Hotte>	JavaScript, Ajax und mehr	2	15.11.2011 08:25
Jquery Multifile upload Dateiname und Groesse	patrick89	JavaScript, Ajax und mehr	4	25.10.2011 20:20
[Erledigt] jquery ajax request ist immer null	taurus	JavaScript, Ajax und mehr	3	29.08.2011 00:00
[Erledigt] Jquery AJAX request wird erst am Ende ausgeführt	PiXeL1337	JavaScript, Ajax und mehr	10	24.02.2011 09:02
HTTP Request (Upload von Daten) + Login (Cookie)	Smut	PHP Tipps 2010	3	24.10.2010 14:50
jquery: dialogbox funktioniert nicht	Dreamwatcher	JavaScript, Ajax und mehr	16	22.07.2010 18:22
JQuery Upload mittels Array/hiddenfields	Das_Pfau	JavaScript, Ajax und mehr	7	13.03.2010 11:03
Bei Upload mit Jquery Multifile-Plugin wird immer nur eine Datei hochgeladen	Silent	PHP Tipps 2010	20	25.02.2010 08:24
http_class verwenden	hans213	PHP Tipps 2009	27	15.01.2010 03:07
Lauftext nach ajax request ?!?!	8eww	JavaScript, Ajax und mehr	11	25.04.2009 12:41

15.12.2011, 08:28
dreamcatcher Erfahrener Benutzer Registriert seit: 28.12.2010 Beiträge: 599 PHP-Kenntnisse: Anfänger	Upload in DialogBox (jQuery UI, sprich via XMLHTTP Request) Hallo, ich habe eine jQuery Dialogbox. Alle Elemente daraus gehe ich automatisch via .serialize() durch und übergebe diese dann an meine mail.php. Die mail.php verschickt eine Mail mit den Daten und speichert die Daten in einer DB. Nun setzt die DialogBox (Beispiel: http://jqueryui.com/demos/dialog/modal.html) einen XMLHTTP Request ab, sprich postet die Daten über .post(). Da ein Fileupload, wie schon mehrfach im Web nun gelesen, darüber (Ajax request) nicht möglich ist, gibt es die Möglichkeit via hidden frames. Nun wird meine Dialogbox zum Versand von Bewerbungsdaten genutzt, sprich ich habe das Problem, dass ich eine vorher (vor dem Abschicken aller Daten) hochgeladene Datei nicht mehr zuordnen kann. Ich möchte, dass alle (!) Daten gleichzeitig gepostet werden, damit diese dann in einer Mail herausgehen und einmal in der DB gespeichert werden. Alles andere macht den Vorgang unnötig kompliziert !? Meine Frage: Wie realisiert man eine DialogBox, die sowohl alle Felder als auch einen Dateiupload in einem Request posted? Das Ziel ist, die Datei als auch die Benutzerdaten gleichzeitig verarbeiten zu können. Bzw. wenn das technisch nicht möglich ist, dann die Frage, wie würdet ihr die geuploadete Datei, welche geuploadet werden muss bevor alle Daten gesendet werden kennzeichnen, damit diese am Ende dem Bewerben zuzuordnen ist ? Datei mit IP in die DB und beim absenden der Daten einen IP Check machen ? Aktuelles Beispiel: index.php PHP-Code: /** * Dialog "Arbeitgeber anschreiben" * / $('#modalWindow_contactAdvertiser').dialog({ autoOpen: false, modal: true, height: '570', width: '525', //Favorites: fold & puff & scale show: 'fold', hide: 'fold', buttons: { "Send E-Mail": function(){ //Custom closure for $.post function() var thisDialog = this; //Ajax $.post requerst \|\| serialize = grab all form elements $.post( "./mail.php", $('#contactAdvertiser').serialize(), [...] } }); //Open Event handler $('.openModal_contactAdvertiser').click(function(){ $('#modalWindow_contactAdvertiser').dialog('open'); return false; }); [...] <!-- HiddenModalDialog_contactAdvertiser --> <div id="modalWindow_contactAdvertiser" title="Arbeitgeber anschreiben" style="display:none"> <form id="contactAdvertiser"> <!-- Applicantformular --> <fieldset style="border: none;"> <label for="attachment1">Attachment (Anschreiben & Lebenslauf):</label> <input type="file" name="attachment1" id="attachment1"/> </fieldset> <!-- End Applicantformular --> </form> </div> <!-- End of HiddenModalDialog_contactAdvertiser --> Miniaturansicht angehängter Grafiken Geändert von dreamcatcher (15.12.2011 um 08:39 Uhr).*


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten