Prototype insert(); lässt sich nicht mehrfach aufrufen

Hallo liebe Community,

nach langer Zeit melde ich mich auch mal zurück.

Ich generiere mit Javascript 4 Arrays (global).
Die Daten jedes Arrays sollen in einer eigenen <UL> angezeigt werden, dafür verwende ich Prototype. Ich rufe eine Javascript-Funktion auf mit der ID der <UL> und dem Arraynamen als Parameter. Hier die Funktion:
Code:
function showSkillList(skillListArray, skillListHtml) {
    for(var k in skillListArray)
    {
      $(skillListHtml).insert({bottom: '<li>'+skillList[k].name});
    }
  }

Nun hab ich habe folgendes Problem
Rufe ich sie einmal auf, funktioniert es einwandfrei.
Rufe ich sie mehrmals auf, funktioniert es auch nur einmal.
Code:
showSkillList(priClsPriSkills, 'priClsPriSkillList'); // Das geht und die <UL> wird gefüllt.
showSkillList(priClsSecSkills, 'priClsSecSkillList'); // Da passiert nichts mehr.

Ich möchte es ungern mit DOM machen, darum wollte ich Fragen, ob sich das mit Prototype lösen lässt?

Außerdem habe ich noch folgende Frage:
Wie kann ich (am besten mit Prototype) beim Aufrufen der Funktion erstmal alle <LI>-Elemente innerhalb der entsprechenden <UL> löschen, bevor ich die neuen hinzufüge?

Liebe Grüße,
Daniel
 
Moin Daniel,

hast du irgendwo ausserhalb des geposteten Codes etwas namens skillList verfügbar?

Code:
$(skillListHtml).insert({bottom: '<li>'+skillList[k].name});
 
Moin Daniel,

hast du irgendwo ausserhalb des geposteten Codes etwas namens skillList verfügbar?

Code:
$(skillListHtml).insert({bottom: '<li>'+skillList[k].name});

Ja, hab ich. Hatte ich vergessen dazu zu schreiben.

priClsPriSkillList, priClsSecSkillList, secClsPriSkillList und secClsSecSkillList sind einfache Arrays die nur die ids der Skills enthalten.
skillList ist ein globales Array das alle Daten enthält.

Es funktioniert einwandfrei. Die erste Liste wird erstellt.
Die Zweite, Dritte und Vierte bleibt allerdings leer!
Ersetze ich insert(); durch ein einfaches alert(); dann werden alle 4 Listen ausgegeben.
Also vermute ich mittlerweile das es ein Prototype-Bug ist, oder ich die Funktion falsch anwende.
 
Könntest du mal in Ausschnitten skillList und die Arrays mit den IDs posten?

Ich vermute, dass das Problem in deren Aufbau liegt, oder andersrum an deinem Zugriff auf die IDs.

Denn um "echte" Arrays zu durchlaufen, ist die von dir verwendete Syntax
Code:
for(var k in skillListArray)
nicht gedacht. Der korrekte Weg wäre hier:
Code:
for(k=0;k<skillListArray.length;++k)
 
skillList (skills.js - beinhaltet nur dieses Array) (Stark gekürzte Version)
Code:
jsonSkillList = {
	/* Krieger Primärskills (ID 1 - 17)  */
	1: {
		'id':			1,
		'type':			'active',
		'name':			'Raserei',
		'class1':		'krieger',
		'class2':		'krieger',
	}, 
	2: {
		'id':			2,
		'type':			'active',
		'name':			'Eröffnungsangriff',
		'class1':		'krieger',
		'class2':		'krieger',
	}
}
skillList = eval(jsonSkillList);

Codeschnipsel bei dem ein Array erzeugt wird (priClsPriSkills)
Code:
for(var k in skillList) {
      // priClsPriSkills auslesen
      if((skillList[k].class1 == priCls) && (skillList[k].class2 == priCls) && (skillList[k].lvl <= priClsLvl)) {
        priClsPriSkills[k] = skillList[k].id;
      }
}
 
Zuletzt bearbeitet:
Hier mal 2 Beispiele, um die Unterschiede zu demonstrieren...es liegt an der Art, wie der Array durchlaufen wird:
Funktioniert nicht:
Code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; 
                                charset=ISO-8859-1"   />
<meta name="author"             content="doktormolle" />
<meta name="date"               content="2009-07-23" />
<title>Test</title>
<script src="p1603.js" type="text/javascript"></script>

<style type="text/css">
<!--
-->
</style>
</head>
<body>
<ul id="priClsPriSkillList">
<li>test
</ul>
<ul id="priClsSecSkillList">
<li>test
</ul>
<script type="text/javascript">
<!--
function showSkillList(skillListArray, skillListHtml,clear) 
{
    if(clear)$(skillListHtml).innerHTML='';
    for(var k in skillListArray)
    {
      $(skillListHtml).insert({bottom: '<li>'+skillList[skillListArray[k]].name});
    }
  }
priClsPriSkills=[1,2,3];
priClsSecSkills=[4,5,6];
skillList={
            1:{'name':'primaryName#A'},
            2:{'name':'primaryName#B'},
            3:{'name':'primaryName#C'},
            4:{'name':'secondaryName#AA'},
            5:{'name':'secondaryName#BB'},
            6:{'name':'secondaryName#CC'}
          }



showSkillList(priClsPriSkills, 'priClsPriSkillList',1);
showSkillList(priClsSecSkills, 'priClsSecSkillList',1); 
//-->
</script>
</body>
</html>
Funktioniert:
Code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; 
                                charset=ISO-8859-1"   />
<meta name="author"             content="doktormolle" />
<meta name="date"               content="2009-07-23" />
<title>Test</title>
<script src="p1603.js" type="text/javascript"></script>

<style type="text/css">
<!--
-->
</style>
</head>
<body>
<ul id="priClsPriSkillList">
<li>test
</ul>
<ul id="priClsSecSkillList">
<li>test
</ul>
<script type="text/javascript">
<!--
function showSkillList(skillListArray, skillListHtml,clear) 
{
    if(clear)$(skillListHtml).innerHTML='';
    for(k=0;k<skillListArray.length;++k)
    {
      $(skillListHtml).insert({bottom: '<li>'+skillList[skillListArray[k]].name});
    }
  }
priClsPriSkills=[1,2,3];
priClsSecSkills=[4,5,6];
skillList={
            1:{'name':'primaryName#A'},
            2:{'name':'primaryName#B'},
            3:{'name':'primaryName#C'},
            4:{'name':'secondaryName#AA'},
            5:{'name':'secondaryName#BB'},
            6:{'name':'secondaryName#CC'}
          }


showSkillList(priClsSecSkills, 'priClsSecSkillList',1); 
showSkillList(priClsPriSkills, 'priClsPriSkillList',1);
//-->
</script>
</body>
</html>

Die erste Methode zum iterieren ist garkeine Methode zum Iterieren, sondern liefert alle Eigenschaftsnamen eines Objektes...das müssen nicht nur die sein, die du selbst definiert hast, sondern können auch (von JS) vordefinierte Eigenschaften sein.....ein Array hat ja von Hause aus bspw. eine length-Eigenschaft und diverse Methoden....bei deren Auffinden deine Variante abbricht.
Im Details war es bei mir die Methode "each()" ....Prototypejs erweitert den Array-Prototype um diese Methode

Die 2. Variante hingegen liefert ausschliesslich die numerischen Schlüssel der Array-Elemente, weshalb sie funktioniert.
 
Vielen Dank, Sven.
Ich hab's verstanden.
Irgendwie meinte ein Google-Ergebnis zu mir, dass die Methode die ich verwendet habe dem foreach() in PHP entspricht, oder zumindest habe ich es so verstanden. :)

Jetzt hab ich allerdings folgendes, neues Problem:

skillName.length ist undefined

Was wohl daran liegt, das das Array auf einem JSON-Objekt basiert.
Hier die skills.js (gekürzt)
Code:
jsonSkillList = {
	/* Krieger Primärskills (ID 1 - 17)  */
	1: {
		'id':			1,
		'name':			'Raserei'
	}, 
	2: {
		'id':			2,
		'name':			'Eröffnungsangriff'
	},
// .....
	48: {
		'id':			48,
		'name':			'Verteidigungstechnik'
	}
}
skillList = eval(jsonSkillList);
alert(skillList.length);
Allerdings sind die Keys NICHT durchgehend, sondern immer identisch der ID.

Wie bestimme ich jetzt die Größe des Arrays?
 
Hi,

bei skillList handelt es sich nicht um ein Array, sondern um ein Objekt. Dieses kannst du wiederum mit der for-in-Schleife durchlaufen und eine Zählvariable in jedem Durchlauf inkrementieren.
Code:
var intLen = 0;

for(var k in skillList){
  intLen++;
}
alert(intLen);

Ciao
Quaese
 
Ok vielen dank.
So hatte ich es auch gemacht, aber ich dachte mir, dass das bestimmt wieder falsch ist. :)


Also Danke an alle =) *erledigt*

Edit: und wieder auf.

Das Objekt ist ja nicht durchgehend durchnummiert von 1-27, wird es zwar irgendwann sein, aber derzeit ist es das nicht.
Geht das trotzdem irgendwie oder muss ich die Keys jetzt schon so ändern, dass sie stimmen?
 
Zuletzt bearbeitet:
Du musst garnichts umbenennen.
Wenn dies Objekt wirklich nur diese weiteren Objekte beinhaltet, wie sie aus deinem Code-Ausschnitt hervorgehen, dann wird Quase's Code bei jedem gefundenen Member den Zähler hochzählen....wie die Sache dann heisst, ist dabei egal.
 

Neue Beiträge

Zurück