Value von jQueryUI Selectmenu wird nicht übergeben

Johnnii360

Erfahrenes Mitglied
Servus zusammen!

Ich häng schon seit Stunden an ein und demselben Problem rum. Und zwar habe ich hier ein Form in dem ein mit jQueryUI erstelltes Selectmenu steht. Dies wird beim Öffnen eines Dialogs in den Dialog geladen. Beim Öffnen des Dialogs wird per AJAX ein JSON String mit appaendTo ins Selectmenu geladen. Die Optionen werden alle 1a angezeigt, aber er übergibt die Auswahl nicht ans andere PHP-Script.

Hier der Dialog-Code mit append und Funktion zur Übergabe ans PHP-Script:
Javascript:
    // Button: Neues Dokument
    $("button#DokumenteNeuesDokument").button({
    icons: {
        primary: "DokumenteNeuesDokument"
    }
    }).click(function(){
    // Dialog zum Hinzufügen einer neuen Datei
    var DocumentsNewFileDialog = '<div id="DocumentsNewFileDialog" name="DocumentsNewFileDialog" title="Neues Dokument">\n\
    <form id="DocumentsNewFileForm" name="DocumentsNewFileForm" action="#" method="post" enctype="multipart/form-data">\n\
    <p>\n\
    <label for="DocumentsNewFile_Cat" style="display: block; font-weight: bold; margin-bottom: 3px;">Kategorie</label>\n\
    <select id="DocumentsNewFile_Cat" name="DocumentsNewFile_Cat" style="overlay: visible;">\n\
    <option value="NULL">Bitte wählen...</option>\n\
    </select>\n\
    <label for="DocumentsNewFile_Name" style="display: block; font-weight: bold; margin-top: 12px; margin-bottom: 3px;">Name</label>\n\
    <input type="text" id="DocumentsNewFile_Name" name="DocumentsNewFile_Name" maxlength="150">\n\
    <label for="DocumentsNewFile_Upload" style="display: block; font-weight: bold; margin-top: 12px;  margin-bottom: 3px;">Datei Hochladen</label>\n\
    <input type="file" id="DocumentsNewFile_Upload" name="DocumentsNewFile_Upload">\n\
    <p style="padding-left: 22px;">-- oder --</p>\n\
    <label for="DocumentsNewFile_URL" style="display: block; font-weight: bold; margin-top: 12px;  margin-bottom: 3px;">Datei-URL</label>\n\
    <input type="text" id="DocumentsNewFile_URL" name="DocumentsNewFile_URL" maxlength="250">\n\
    </p>\n\
    </form>\n\
    </div>';
  
    $( DocumentsNewFileDialog ).dialog({
        autoOpen: false,
        modal: true,
        width: 300,
        height: "auto",
        show: {
        effect: "fade",
        duration: "fast"
        },
        hide: {
        effect: "fade",
        duration: "fast"
        },
        open: function(){
       // Hole JSON-Daten für Selectmenu
        $.getJSON('ajax/dokumente_dialogs_formitems.php', function(data){
            var $select = $("<select>");
            $.each([data], function(i, optgroups) {
            $select.appendTo("div#DocumentsNewFileDialog form#DocumentsNewFileForm #DocumentsNewFile_Cat");
            $.each(optgroups, function(groupName, options) {
                var $optgroup = $("<optgroup>", {label: groupName});
                $optgroup.appendTo($select);

                $.each(options, function(j, option) {
                var $option = $("<option>", {text: option.text, value: option.value});
                $option.appendTo($optgroup);
                });
            });
            });
        });
        },
        buttons: {
        "Abschicken": function() {
            // AJAX-Anweisung zum Ausführen des PHP-Scripts
            $.ajax({
            url: 'ajax/dokumente_neues_dokument.php',
            type: 'POST',
            data: new FormData( $("#DocumentsNewFileDialog #DocumentsNewFileForm")[0] ),
            processData: false,
            contentType: false,                 
            success: function(data, textStatus, jqXHR)
            {
                // Prüfe ob alles i.O. ist
                if(data === 'success' && typeof data.error === 'undefined')
                {
                $(".ui-dialog-content").dialog().dialog( "close" ); // Schließe Dialog
                window.location.reload(true); // Lade Elterntab neu
                }
                else
                {
                console.log(data);
                $( DialogAddError ).dialog( "open" ); // Öffne Fehlerdialog bei Scriptfehler
                }
            },
            error: function(jqXHR, textStatus, errorThrown)
            {
                console.log('FEHLER: '+jqXHR);
                $( DialogAddError ).dialog( "open" ); // Öfnne Fehlerdialog bei allgemeinem Fehler
            }
            });
        },
        "Abbrechen": function() {
            $("div#DocumentsNewFileDialog form#DocumentsNewFileForm").trigger( "reset" ); // Resette Dialogformular
            $( this ).dialog( "close" ); // Schließe Hauptdialog
            $(".ui-dialog-content").dialog().dialog( "close" ); // Schließe alle weiteren Dialoge die evtl. folgten
        }
        }
    });
  
    $("select#DocumentsNewFile_Cat").selectmenu();

    $("#DocumentsNewFileDialog").dialog( "open" );
    });

So empfängt das PHP-Script die Vars (Filter):
PHP:
<?php
$Kategorie = filter_input(INPUT_POST, "DocumentsNewFile_Cat", FILTER_SANITIZE_NUMBER_INT);
$Name = filter_input(INPUT_POST, "DocumentsNewFile_Name", FILTER_SANITIZE_MAGIC_QUOTES);
$URL = filter_input(INPUT_POST, "DocumentsNewFile_URL", FILTER_SANITIZE_MAGIC_QUOTES);
?>

Also nochmal genau: Die Daten werden wunderbar im Selectmenu angezeigt. Allerdings wird die Auswahl nicht übergeben. Die Übergabe des Selectmenus ist leer.

Vielen Dank schon mal für Eure Hilfe!
 
Habe mir diesem Code hier nochmal nachgeschaut, ob das Selectmenu auch was übergibt. Aber irgendwie heißt es immer "undefinied".
Javascript:
    $("select#DocumentsNewFile_Cat").selectmenu({
        select: function(foo, bar){
        alert(foo.value);
        }
    });
De facto gibt das Select nichts zurück. Interessant ist auch, wenn ich das Selectmenu NICHT mittels jQueryUI formatiere und die Daten dann hinzufügen lasse, wird nichts angezeigt. Irgendwie rall ich das nicht und Dr. Google hat da leider auch nichts von Ratiopharm.
 
Okay, jetzt habe ich es zumindest geschafft, dass es auch angezeigt wird, wenn das Selectmenu NICHT via jQUI formatiert wird. :)
Javascript:
open: function(){
        $.getJSON('ajax/dokumente_dialogs_formitems.php', function(data){
            var $select = $("#DocumentsNewFile_Cat");
            $select.appendTo("#DocumentsNewFile_Cat");
            $.each([data], function(i, optgroups) {
            $.each(optgroups, function(groupName, options) {
                var $optgroup = $("<optgroup>", {label: groupName});
                $optgroup.appendTo($select);

                $.each(options, function(j, option) {
                var $option = $("<option>", {text: option.text, value: option.value});
                $option.appendTo($optgroup);
                });
            });
            });
        });
        },
Die Frage ist nur: Wie bekomm ich jetzt hin, dass er die Auswahl übergibt?
 
Hab's! Jetzt geht's! :)
Hatte nur was zum Test geändert gehabt und vergessen wieder zurückzuändern. So wie's jetzt oben steht, geht's.
 
Zurück