Frage zu Javascript und array Teil1/2?

[Tragon]

Also folgender Quelltext und nun sollte
<input type="hidden" name="jobkategorie[]Content" value="">
<script language="JavaScript">
function Fsrch_category_migrateOption() {
var optionId;
var i=0;
var aSelect = eval("document.forms[0].jobkategorie[]");
do {
if (aSelect.length>i && aSelect.options[i].selected) optionId = aSelect.options[i].value;
i++;
} while( i<aSelect.length && (optionId == null || optionId == "") );
if ( optionId == "" || optionId == null ) return;
var i;
for(i=1; i<2; i++) {
eval("document.forms[0].Fsrch_category_category" + i + ".options.length = 0");
}
Fsrch_category_migrateOptionList(0, optionId);
}
function Fsrch_category_areRelated(testOptionId, baseOptionId) {
var optionArray;
var parentId = baseOptionId;
do {
if (testOptionId == parentId)
return true;
optionArray = eval("window.array_Fsrch_category_"+parentId);
if (optionArray)
parentId = optionArray[0][1];
} while (optionArray && parentId != null && parentId != "");
return false;
}
function Fsrch_category_migrateOptionList(level, selectedId) {
var aSelect = eval("document.forms[0].Fsrch_category_category" + level);
var n = aSelect.length;
var i;
for(i=1; i<n; i++) {
var anOption = aSelect.options[i].value;
if ( Fsrch_category_areRelated(anOption, selectedId) ) {
aSelect.options[i].selected = true;
var optionListArray = eval("window.array_Fsrch_category_"+anOption);
if ( optionListArray && optionListArray.length > 1 ) {
aSelect = eval("document.forms[0].Fsrch_category_category" + (level+1));
n = optionListArray.length;
for(i=0; i<n; i++) {
var optionId;
var optionName;
if (i==0) {
optionId = anOption;
optionName = "*";
}
else {
optionId = optionListArray[i];
optionName = eval("array_Fsrch_category_"+optionId+"[0][0]");
}
aSelect.options[i] = new Option(optionName,optionId);
}
Fsrch_category_migrateOptionList(level+1, selectedId);
return;
}
}
}
}
function Fsrch_category_searchParent(searchId, parentId) {
var anArray = eval("window.array_Fsrch_category_" + parentId);
var j;
if (anArray) {
for(j=1; j<anArray.length; j++) {
if (anArray[j] == searchId) {
return anArray[j];
}
else {
var found = Fsrch_category_searchParent(searchId, anArray[j]);
if (found != null) return found;
}
}
}
return null;
}
function Fsrch_category_checkForParent(optionId) {
var aSelect = eval("document.forms[0].jobkategorie[]");
var i;
for(i=0; i<aSelect.length; i++) {
var found = Fsrch_category_searchParent(optionId, aSelect.options[i].value);
if (found != null) return aSelect.options[i].text;
}
return null;
}
function Fsrch_category_checkForChilds(optionId, selectIt) {
var childArray = new Array();
var aSelect = eval("document.forms[0].jobkategorie[]");
var i;
for(i=0; i<aSelect.length; i++) {
var found = Fsrch_category_searchParent(aSelect.options[i].value, optionId);
if (found != null) {
childArray[childArray.length] = aSelect.options[i].value;
if (selectIt) aSelect.options[i].selected = true;
}
}
if (childArray.length>0) return childArray;
return null;
}
function Fsrch_category_collectOptions() {
var aSelect = eval("document.forms[0].jobkategorie[]");
document.forms[0].jobkategorie[]Content.value = "";
for(i=0; i<aSelect.length; i++) {
if (i>0) document.forms[0].jobkategorie[]Content.value += "|";
document.forms[0].jobkategorie[]Content.value += aSelect.options[i].value;
}
}
collectArray[collectArray.length] = "Fsrch_category";
function Fsrch_category_getLeftOptionAsId() {
var aSelect = null;
if (aSelect == null || aSelect.selectedIndex == -1) {
aSelect = document.forms[0].Fsrch_category_category1;
}
if (aSelect == null || aSelect.selectedIndex == -1) {
aSelect = document.forms[0].Fsrch_category_category0;
}
if ( aSelect != null && aSelect.selectedIndex != -1 && aSelect.options[aSelect.selectedIndex].value != "RootOptionList") {
return aSelect.options[aSelect.selectedIndex].value;
}
else return "";
}
function Fsrch_category_addOption() {
var optionId = Fsrch_category_getLeftOptionAsId();
if (optionId != "") {
var optionText = eval("array_Fsrch_category_"+optionId+"[0][0]");
var parent = Fsrch_category_checkForParent(optionId);
if (parent != null) {
alert("" + optionText + " ist ein Teil von " + parent + ".\nSie müssen erst " + parent + " löschen, um " + optionText + " hinzufügen zu können.");
return;
}
var aSelect = eval("document.forms[0].jobkategorie[]");
for(i=0; i<aSelect.length; i++) {
if (aSelect.options[i].value == optionId) {
alert("Sie haben diese Option schon hinzugefügt ");
return;
}
}
var childArray = Fsrch_category_checkForChilds(optionId, true);
if (childArray != null) {
alert("Teile aus " + optionText + " wurden bereits ausgewählt.\nLöschen Sie die markierten Elemente, bevor Sie " + optionText + " hinzufügen.");
return;
}
var newOption = "new Option('"+optionText+"', '"+optionId+"')";
if (aSelect) aSelect.options[aSelect.length] = eval(newOption);
}
else alert("Wählen Sie zuerst eine Option aus der Auswahlbox aus.");
}
function Fsrch_category_removeOption() {
var textArray = new Array();
var valueArray = new Array();
var cnt = 0;
var aSelect = eval("document.forms[0].jobkategorie[]");
for(i=0; i<aSelect.length; i++) {
if (!aSelect.options[i].selected) {
textArray[cnt] = aSelect.options[i].text;
valueArray[cnt] = aSelect.options[i].value;
cnt++;
}
}
if (aSelect.length==cnt) {
alert("Markieren Sie bitte zuerst etwas in der Liste unten.");
return; }
for(i=aSelect.lenght-1; i>=0; i--) {
aSelect.options[i] = null;
}
aSelect.options.length = 0;
for (i = 0; i < cnt ; i++) {
aSelect.options[aSelect.length] = new Option(textArray[i], valueArray[i], false, false);
}
aSelect.selectedIndex = -1;
}
</script>
<table cellpadding="0" cellspacing="0" border="0"><tr>
<td align="left" colspan="2">


<SCRIPT LANGUAGE="JavaScript">
<!--
function Fsrch_category_populateOptions(id) {
var i;
var aSelect;
for(i=id+1; i<2; i++) {
aSelect = eval("document.forms[0].Fsrch_category_category" + i);
aSelect.options.length = 0;
aSelect.selectedIndex = -1;
}
aSelect = eval("document.forms[0].Fsrch_category_category" + id);
var s = aSelect.options[aSelect.selectedIndex].value;
var selectedArray = eval("window.array_Fsrch_category_"+s);
if (!selectedArray || selectedArray.length<=1)
{
aSelect = eval("document.forms[0].Fsrch_category_category" + (id+1))
aSelect.options.length = 0;
for (i = 0; i < 5; i++)
{
aSelect.options[i] = new Option("","");
}
return;
}
var idx = aSelect.selectedIndex;
if (aSelect.options[idx].text == "*") return;
if (aSelect.options[idx].text == "-") return;
aSelect = eval("document.forms[0].Fsrch_category_category" + (id+1));
for(i=0; i<selectedArray.length; i++) {
var optionId;
var optionName;
if (i==0) {
optionId = s;
optionName = "*";
}
else {
optionId = selectedArray[i];
optionName = eval("array_Fsrch_category_"+optionId+"[0][0]");
}
aSelect.options[i] = new Option(optionName,optionId);
}
}

var lookup_Fsrch_category = new Array("002_120_000_000","(Natur-) Wissenschaft & Forschung","002_120_010_000","Beratung: Wissenschaft & Forschung"
//HIER STEHEN DIE RESTLICHEN FÜLLWERTE........
,"theend: 233");
var tree_Fsrch_category = new Array("0,-1,0,1,2,3,4,5,6,7,8,9,10,11",
"1,0,1",
//usw.....

"230,227,1","231,227,1","232,227,1","theend");

for (i=0; i<tree_Fsrch_category.length-1; i++) {
splitted = tree_Fsrch_category[i].split(",");
id = lookup_Fsrch_category[parseInt(splitted[0]) * 2];
aName = lookup_Fsrch_category[parseInt(splitted[0]) * 2 + 1];
s = "var array_Fsrch_category_" + id + " = new Array(new Array(\"" + aName + "\",";
myParent = parseInt(splitted[1]);
if (myParent == -1) {
s = s + "\"\"";
}
else {
s = s + "\"" + lookup_Fsrch_category[myParent * 2] + "\"";
}
s = s + "," + splitted[2] + ")";
for (idsearch=3; idsearch<splitted.length; idsearch++) {
s = s + ",\"" + lookup_Fsrch_category[parseInt(splitted[idsearch]) * 2] + "\"";
}
s = s + ");";
eval(s);
}
// -->
</script>

[Tragon]

JavaScript Teil2/2?

<select name="Fsrch_category_category0" onChange="Fsrch_category_populateOptions(0);" width="300" style="width:300px;">
<option value="RootOptionList">-</option>
<option value="002_120_000_000">(Natur-) Wissenschaft & Forschung</option>
//weiter optinsfelder....usw...
</select><br>
<select name="Fsrch_category_category1" width="300" style="width:300px;">
<OPTION value=''> </OPTION>
<OPTION value=''> </OPTION>
<OPTION value=''> </OPTION>
<OPTION value=''> </OPTION>
<OPTION value=''> </OPTION>
<OPTION value=''> </OPTION>
</select><br>
</td></tr>
<tr><td align="center" valign="middle" width="50%">
<script language="JavaScript">
<!--
if (!addButtonImage) {
var addButtonImage = new Image();
; addButtonImage.src = "/bildpfad_btn_on.gif";
}
if (!removeButtonImage) {
var removeButtonImage = new Image();
; removeButtonImage.src = "/BILDPFAD_remove_btn_on.gif";
}
//-->
</script>
<a href="javascript:Fsrch_category_addOption();Fsrch_category_collectOptions();" onMouseOver="document.images['Fsrch_category_img_add'].src=addButtonImage.src;" onMouseOut="document.images['Fsrch_category_img_add'].src='/bildpfad_btn_on';"><img vspace="10" name="Fsrch_category_img_add" src="/btns/btn_add_off.gif" border="0" alt="Option der Liste hinzufügen."></a></td><td align="center" valign="middle" width="50%">
<a href="javascript:Fsrch_category_removeOption();Fsrch_category_collectOptions();" onMouseOver="document.images['Fsrch_category_img_remove'].src=removeButtonImage.src" onMouseOut="document.images['Fsrch_category_img_remove'].src='/BILDPFAD_remove_btn_on'"><img name="Fsrch_category_img_remove" src="/btn_remove_off.gif" border="0" alt="Option(en) aus der Liste entfernen."></a></td></tr>
<tr><td align="left" colspan="2">
Ausgewählte Kategorien:<br><select name="jobkategorie[]" multiple size="4" width="300" style="width:300px;"></select>

Nun sollte die jobkategorie mit array sein da ich es im nächsten Formular in die Datenbank eingeben muß. Alelrdings wenn ich die Klammern mache funktioniert dieses Javascript nicht mehr kann mir jemand weiterhelfen?

[mkJack]

Zugegebenermaßen bin ich zu faul dein extrem kurzes Script komplett durchzusehen.

Wenn dein Problem aber nur das jobkategorie[] in Verbindung mit JavaScript ist, dann habe ich eine Lösung für dich.

In diesem Fall darfst du innerhalb von JavaScript das SELECT-Feld nicht mit dem Namen ansprechen, sondern mit dem Index deines Elements.

Beispiel:
(elements[0] gilt nur, wenn das Select-Feld das erste im Formular ist, ansonsten nimmst du die 1 für das Zweite, die 2 für das Dritte usw., siehe hier)

<script language="Java&#115;cript">
function newopt() {
  d = document;
  newindex = d.MyForm.elements[0].options.length;
  d.MyForm.elements[0].options[newindex] = new Option("Neue Kategorie");
  }
</script>

<form name="MyForm" method=post>
<select name="jobkategorie[]" multiple size="8" width="300" style="width:300px;">
<option value="eins">Handwerk</option>
<option value="zwei">Handel</option>
<option value="drei">Verkehr</option>
</select> 
<br>
<a href="java&#115;cript:newopt()">Neue Kategorie einfügen</a><br><br>
<input type=submit value="OK">
</form>

Und hier siehst du das Beispiel in Aktion.

[Tragon]

Ne andere Möglichkeit gibt es nicht oder??
Desweiteren ist es wieder scheiß viel Arbeit es so umzuschreiben, glaub ich zumindest! Könnte sich niemand erbarmen und versuchen sich den MonsterQuelltext reinzuziehen und mein Prob zu lösen?Bitte,bitte!

[mkJack]

Tragon schrieb
Desweiteren ist es wieder scheiß viel Arbeit es so umzuschreiben

Wo ist denn das große Problem die SELECT-Namen im Javascript in elements[0], elements[1] etc. abzuändern?
So ganz verstehe ich das jetzt nicht.

[Tragon]

Mein Problem ist halt das ich des glaub ich einfach net versteh wie du des meinst, sorry!
Bei allen select namen oder wie? Könntest du des bitte,bitte schnell auf mein Beispiel beziehen?

[mkJack]

Beispiel:

<form name=MyForm> 
<input type="text" name="text1">                    = elements[0] 
<input type="hidden" name="hidden1" value="hallo">  = elements[1] 
<select name="selectname[]" size=5 multiple>        = elements[2] 
<input type="text" name="text2">                    = elements[3] 
<select name="diesunddas[]" size=5 multiple>        = elements[4] 
</form>

Im Javascript sieht so die Zuweisung zu den Feldern aus:
aus
document.MyForm.selectname.value
wird
document.MyForm.elements[2].value

aus
document.MyForm.diesunddas.value
wird
document.MyForm.elements[4].value

usw.

Wenn du rausbekommen möchtest, welche Nr. jedes Element in deinem Formular hat, kannst du folgende Hilfe einsetzten.
Der Code muß direkt vor das </form> gesetzt werden:

<script language="java&#115;cript">
 d = document;
 ausgabe = "";
 for (i=0;i<d.MyForm.elements.length;i++)
   ausgabe += "elements["+i+"] = "+d.MyForm.elements[i].name+"  ("+d.MyForm.elements[i].type+")\n";
 alert (ausgabe);
</script>

[Tragon]

Hi
sorry aber ich bin echt zu blöd und krieg des einfach netg hin das es funktioniert! Kannst du mir des bitte,bitte so schreiben das es funzt?
Oder was gäbe es sonst noch für eine Möglichkeit aus dem Multiplen Optionsfeld(außer über ein Php Array ) die Werte auszulesen und mit Hilfe von Php in die Datenbank einzufügen?

[mkJack]

Wo der Fehler liegt ist bekannt, ich habe versucht zu erklären, wie du es angehen kannst, konkrete Beispiele hast du auch ...

Vielleicht hilft noch ein Tip:
Alle Javascript-Funktionen rauschmeissen und mit nur einer anfangen. Wenn die eine geht, dann die nächste etc.

[Tragon]

Jo danke hab des jetzt Stück für Stück abgearbeitet und jetzt funktioniert es. Man sollte halt ein bißchen mehr Gelduld haben und die Rechtschreiber Fehler vermeiden!
Also nochmals thanx!

[smeagol]

Eine viel einfachere Lösung wäre sicherlich, das entsprechende Form-Element mit seinem Namen als Key im elements-array anzusprechen:

document.myFrom.elements["jobkategorie[]"].value = "foo";