• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

jQuery Mobile SELECT Form Style

xoli

New member
Hi

Ich weiß nicht genau ob ich in dieser Rubrik richtig bin, aber ich hoffe hier kann mir trotzdem jemand helfen.

Ich möchte eine Select-Box per Klick dynamisch mit Javascript erstellen lassen. Das ist soweit kein Thema, aber das Style passt sich nicht dem jQuery Mobile Style an.

Beispiel 1 (funktioniert):
HTML:
<select id="test">
   <option value="0">Test</option>
</select>

und so sieht es aus: Screenshot by Lightshot

Beispiel 2 (funktioniert nicht);
Code:
function Add() {
	var array  = ["Test 1","Test 2","Test 3","Test 4"];
	var myDiv  = document.getElementById("myDiv");
	var myForm = document.createElement("form");
	myForm.setAttribute("method","post");				
				
	var selectList = document.createElement("select");
	selectList.setAttribute("id", "mySelect_1");				
	selectList.setAttribute("data-role", "button"); // per HTML kann ich das so eigentlich steuern
				
	myForm.appendChild(selectList);
	myDiv.appendChild(myForm);
				
	for (var i = 0; i < array.length; i++) {
		var option = document.createElement("option");
		option.setAttribute("value", array[i]);
		option.text = array[i];
		selectList.appendChild(option);
	}
};

Wird der 2. Button per Javascript erstellt sieht der dann so aus: Screenshot by Lightshot

Kann mir da bitte jemand einen Tipp geben, wie ich per Javascript auch auf den 1. Style zugreifen kann ?

Danke und lG
Oliver
 
data-role ist nur ein Attribut und wird nicht von css erfasst.
Das Script welches das data-role ausliest ist schon gelaufen.
Vieleicht gehts aber wenn du den Button clonst dann kann es
sein das er die css classes mit kopiert.
oder du lest die classList eines vorhandenen Buttons aus und
hängst sie an den neuen.
 
Ich danke dir für den Tipp. Dein letzter Post hat leider nicht geklappt, aber "Button Clone" war ein super Tipp.

Code:
$("#myDiv").append('<select class="ui-selectmenu"><option value="1">Test 1</option></select>').enhanceWithin();

Das funktioniert .. ganz wichtig am Ende "enhanceWithin()" zu schreiben. Warum weiß ich nicht und hab mir das auch grad in einem anderen Post erlesen. Ohne gehts aber nicht.

Damit komme ich jetzt jedenfalls klar :)

Danke und lG
Oliver
 
Zurück
Oben