✔ MooTools 1.1 Element Überschreiben

[Gunah]

Moin,

Ich möchte ein Input Feld mittels MooTools ersetzen...

Hier der generierte Quellcode (habe dort keinen Einfluss drauf :-( )

<label for="produkt">Produkt*:</label> 
<input type="text" class="normal required" value="" id="produkt" name="produkt"/>

nun möchte ich per JS den Inhalt verändern, dafür habe ich eine extra HTML Datei erstellt mit einer Select Box drin:

<select class="normal required" id="produkt" name="produkt">
	<option value="PRODUKTNAME">PRODUKTNAME</option>
	<option value="PRODUKTNAME">PRODUKTNAME</option>
</select>

Ich hatte Naiverweise gedacht, dass es so geht:

    new Ajax
        (
         "/uploads/products/prd.html",
            {
                method: 'get',
                onComplete: function(result){
                    $$('input#produkt').setHTML(result);
                }
            }
        ).request();

leider sieht der JS Generierte Code dann so aus:

<input type="text" name="produkt" id="produkt" value="" class="normal required">
	<input xmlns="http://www.w3.org/1999/xhtml">
		<select name="produkt" id="produkt" class="normal required">
			<option value="Produktname">Produktname</option>
		</select>
	</input>
</input>

hatte auch schon überlegt, Tag "input#produkt" zu entfern,
und dann mittels mootools hinter dem "label[for=produkt]" zu packen,
leider finde ich nur funktionen, wo ich es mit in den Label reinpacken kann :-(

generiert werden soll der Code dann so =):

<label for="produkt">Produkt*:</label> 
<select class="normal required" id="produkt" name="produkt">
	<option value="PRODUKTNAME">PRODUKTNAME</option>
	<option value="PRODUKTNAME">PRODUKTNAME</option>
</select>

mit jQuery ist dieses kein Problem bei MooTools bin ich überfragt (Frameworks mische ich nicht!)

Ich hoffe Ihr wisst was ich meine...
Hier die Doku, da habe ich aber irgendwie nichts gefunden :-(
http://docs111.mootools.net/

Danke und Gruß
Gunah

 

[Sven Mintel]

Moin,

setHTML() macht dasselbe wie die Zuweisung von innerHTML.

Es ersetzt ein Element nicht durch das gegebene Fragemt, sondern es ersetzt den Inhalt(als alle Kindknoten etc.) .

Lösung:
Packe das <input> in ein Elternelement, und wende darauf setHTML an.

Übrigens:mittlerweile gibt es mootools 1.2.4 ...setHTML wurde in 1.2.0 durch set('html') ersetzt

 

[Gunah]

das Problem ist, dass dieser Quellcode aus einer verschlüsselten Datei kommt...

daher kaum einfluss... lasse aber nun ein PHP Script drüberlaufen, welches dem Input Element duch bevor es ausgegeben wird einen Container danach erstellt und fertig... somit kann ich das so umbauen wie ich es brauch

zu MooTools 1.2 ist bekannt, würde aber heißen, dass wir alles umbauen müssten, von daher =)

Gruß
Gunah

 

[Gunah]

von einem Problem zum nächsten...

in das Input[type=text] Value wird nun der Name des Produkts reingeschrieben... jetzt wollten wir diese Daten mit übergeben...

<input type="text" class="normal required" value="" id="produkt" name="produkt"/>

der generierte Code sieht so aus:

<p>
<label for="produkt">Produkt</label>                                                            
<span id="ProduktReplace"><select name="produkt" id="produkt" class="normal required">
  <option value="">Bitte wählen …</option>
  <option value="PRODUKTNAME">PRODUKTNAME</option>
</select></span>
</p>

nun wenn man auf Submit drück, und ein einem anderen Feld ein Fehler ist, bzw es nicht ausgefüllt wurde steht oben wieder "Bitte wählen..." statt "PRODUKTNAME"... wenn man in den Quellcode guckt in das InputFeld mit dem "Produktnamen" als Value versehen, daher habe ich folgendes Probiert ohne erfolg:

   var produkt_value = $('produkt').getProperty('value');
    $('produkt').remove();
    new Ajax
    (
        "/uploads/products/prd.html",
        {
            method: 'get',
            onComplete: function(result){
                $$('span#ProduktReplace').setHTML(result);
            }
        }
    ).request();
    if(!produkt_value == false) {
        $$("#produkt option[value="+produkt_value+"]").setProperty('selected','selected');
    }

In der Variable "produkt_value" ist auch definitiv der Wert vorhanden (getestet mit alert() ), leider sehe ich soweit keinen Fehler mehr :-(

und bin schon leicht überfragt:-(

hoffe Ihr könnt mir folgen =)

eben falls SOLVED... habe einfach eine PHP Datei erstellt und lasse nun extra daten per GET mit übermitteln