✔ auswahllisten in overlays/windows

7

7hyrael

Grünschnabel
Hallo zusammen,

bisher hab ich nur als schweigender Mitleser hier teilgenommen, und erstmal ein Danke! Hab schon viel gefunden was mir schnell weitergeholfen hat.
Diesmal bin ich jedoch weder hier noch Sonstwo auf Antworten zu meinem Problem gestoßen. Ich hab mich vor einigen Tagen/Wochen drangemacht ein Verwaltungsprogrämmchen zu erstellen, das den ganzen Ablauf beschleunigen soll.

Um dem Anwendern nun zu ermöglichen Standardtexte zu speichern und zu späterer stunde wieder aufzurufen, wollte ich mit "modalbox" (einer Erweiterung von prototype und script.aculo.us)
ein Overlay "aufgehen" lassen, auf welchem sie diese Standardtexte aus einer drop-downliste auswählen können. und hier liegt nun mein Problem:

Ich bekomm einfach keine Werte in die Auswahlliste.

Die Werte die dort eingetragen werden sollen hole ich mittels php-skript aus der mysql-Datenbank und übergebe sie in Form von JSON - Objekten zurück an das Hauptskript. funktioniert bis dahin einwandfrei.


Ich hab das grob mal in folgendes Skript "verkleinert":

Code: 
<html>
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
      <meta http-equiv="cache-control" content="no-cache">
      <title>TU-Verwaltung</title>
      <script type="text/javascript" src="../js/prototype.js" ></script>
      <script type="text/javascript" src="../js/scriptaculous.js"></script>
      <script type="text/javascript" src="../js/modalbox/modalbox.js"></script>
      <link rel="stylesheet" type="text/css" href="../js/modalbox/modalbox.css">

      <script language="Javascript">
            var node = new Element(
            'div', {
                className: 'warning',
                style: 'border: 1px solid #0F0; display:none'
            }).update(
                new Element('p').update('wählen sie einen der standardtexte aus.')
            ).insert(
                new Element('select', {name: 'stm_list', size: 1, id: 'sel_stm'})
            ).insert(
                new Element('input', {type: 'button', value: 'übernehmen', id: 'uebertrag'})
            ).insert(
                new Element('input', {type: 'button', value: 'Abbrechen', id: 'cancelBut'})
            );

            var hideObserver = Modalbox.hide.bindAsEventListener(Modalbox);

            function setObservers() {
                $('uebertrag').observe('click', hideObserver);
                $('cancelBut').observe('click', hideObserver);
            };
            function removeObservers() {
                $('uebertrag').stopObserving('click', hideObserver);
                $('cancelBut').stopObserving('click', hideObserver);
            }
             function setStammdaten() {

                var options =[{"id":"1","text":"dies ist ein test<\/b>"},{"id":"2","text":"dasdasdasda"},{"id":"3","text":"dasafdghfadgagdfgdf"}];

                var div = document.getElementById("popup");

                var liste = document.createElement('select');

                for(var i=0; i<options.length; i++){

                    var opt = new Option(options[i]['text'],options[i]['text'], false, true);

                    liste.options[liste.options.length]=opt;
                }
 
            }
      </script>
    </head>
    <body>
        <a href="#"
           onclick="Modalbox.show(
               node, {
                    title: this.title,
                    width: 300,
                    afterLoad: setObservers,
                    onHide: removeObservers

                }
            ); reqStammdaten(); return false;"
        >Link</a>

    <textarea name="texta" id="t_area">
    
    </textarea>

    </body>
</html>
}

beim klick auf "Link" soll das Overlay erscheinen, in dem dann die Stammdaten in der Dropdown-Liste angezeigt werden.
Was diese drop-down angeht bin ich übrigens in keinster Weise festgelegt.
Ich bin hier auch sehr offen für Vorschläge das auf andere Art vielleicht besser zu lösen!

da das php-skript einwandfrei funktioniert hab ich den rückgabewert beispielhaft direkt reinkopiert und die funktion die den response verarbeitet vereinfacht.

Wie gesagt bin ich in Sachen AJAX noch nicht wirklich erfahren, was Prototype etc angeht sowieso nicht...

Deshalb auch nicht sehr gebunden. Wenn jemand Vorschläge für eine Lösung hat die auf anderen Bibliotheken basiert, bin ich dafuer genauso dankbar wie für jede andere Hilfe ;)

mfg 7hyrael
 
Zuletzt bearbeitet:
Moin,

keine Ahnung, ob es dein Problem behebt, aber jene Zeile:
Code: 
var options = eval('(' + [{"id":"1","text":"dies ist ein test<\/b>"},{"id":"2","text":"dasdasdasda"},{"id":"3","text":"dasafdghfadgagdfgdf"}] + ')');
...verursacht einen Syntax-Fehler.

Abhilfe:
Code: 
var options =[{"id":"1","text":"dies ist ein test<\/b>"},{"id":"2","text":"dasdasdasda"},{"id":"3","text":"dasafdghfadgagdfgdf"}];

...das eval() ist dort unnötig, denn das JSON ist dort völlig ausreichend und liefert in JS bereits ein Objekt, und muss nicht wie in anderen Sprachen erst dazu gemacht werden.
 
Moin und danke erstmal für die schnelle Antwort!

Sven Mintel hat gesagt.:
Moin,

keine Ahnung, ob es dein Problem behebt, aber jene Zeile:
Code: 
var options = eval('(' + [{"id":"1","text":"dies ist ein test<\/b>"},{"id":"2","text":"dasdasdasda"},{"id":"3","text":"dasafdghfadgagdfgdf"}] + ')');
...verursacht einen Syntax-Fehler.

Abhilfe:
Code: 
var options =[{"id":"1","text":"dies ist ein test<\/b>"},{"id":"2","text":"dasdasdasda"},{"id":"3","text":"dasafdghfadgagdfgdf"}];

...das eval() ist dort unnötig, denn das JSON ist dort völlig ausreichend und liefert in JS bereits ein Objekt, und muss nicht wie in anderen Sprachen erst dazu gemacht werden.
Zum Vergrößern anklicken....

Normalerweise ist dort natürlich
Code: 
                    var options = eval('(' + req.responseText + ')');
zu finden, was ich allerdings ausgetauscht habe, um nicht noch die php-Skripte mitzuposten die (an anderer Stelle) schon funktionieren. Zudem liefern diese nur ausgaben aus einer datenbank.

ich werde deinen abgeänderten code dann in den obigen code einfügen, danke dafür!
 
Zuletzt bearbeitet:
7hyrael hat gesagt.:
Moin und danke erstmal für die schnelle Antwort!

Normalerweise ist dort natürlich
Code: 
                    var options = eval('(' + req.responseText + ')');
zu finden, was ich allerdings ausgetauscht habe, um nicht noch die php-Skripte mitzuposten die (an anderer Stelle) schon funktionieren. Zudem liefern diese nur ausgaben aus einer datenbank.

ich werde deinen abgeänderten code dann in den obigen code einfügen, danke dafür!
Zum Vergrößern anklicken....

Ahso, wenn das so ist, benötigst du schon ein eval()
Trotzdem sind dort 2 Klammern zu viel.

Nutze am Besten die prototype-Methode dafür:

Code: 
 var options =req.responseText.evalJSON();
 
Sven Mintel hat gesagt.:
Ahso, wenn das so ist, benötigst du schon ein eval()
Trotzdem sind dort 2 Klammern zu viel.

Nutze am Besten die prototype-Methode dafür:

Code: 
 var options =req.responseText.evalJSON();
Zum Vergrößern anklicken....

Ok eingebaut und wieder was gelernt ;)

Die beiden Klammern hatte ich bewusst eingebaut.
In der Berufsschule meinte einer der Tutoren diese Klammern wären ab und an von Nöten um Probleme zu vermeiden...
Da sieht man mal wieder dass nich alles was man inner Schule lernt auch brauchbar ist ;)

*bump* :)
Über ein anderes Plugin hab ichs zum laufen bekommen ein "Fenster" zu erstellen in dem diese Funktionalität gegeben ist, allerdings ist das bei weitem nicht so ansehnlich... würde mich auch weiterhin über Vorschläge freuen.

*bump* die 2.

Habe nun ein neues Problem. Innerhalb des Window lasse ich eine Tabelle erzeugen. Dieser möchte ich ein onklick-event pro Zeile zuweise sodass beim Klick der Inhalt übertragen wird. Jetzt wird allerdings bei der Zuweisung mittels

Code: 
table_row.onclick=alert("hallo welt");

das onklick-event schon beim öffnen des window ausgeführt... und bei klicks auf die Tabellenzeilen nicht....
Jemand eine Idee wie ich das Unterbinden kann?
 
Zuletzt bearbeitet:
habs inzwischen auf anderem wege hinbekommen sodass es sehr übersichtlich ist und auch noch gut ausschaut, ganz davon abgesehn dass es einfach besser zu handhaben ist - als tabelle mit onclick-ereigniss auf den reihen die die texte darstellt.

danke für die hilfe sven!
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück