Vorherige Auswahl in SELECT bei onchange()

[Dirk]

Ich habe eine Seite, die eine Tabelle enthält. In jeder Tabellenzeile kann man in einer Spalte (für diese Zeile) aus einer Auswahlliste einen Status auswählen/setzen.
Über der Tabelle habe ich Zähler, die in Abhängigkeit zum gewählten Status zählen, wieviele Tabellenzeilen im Status x, y oder z sind.

Bspw. habe ich 5 Tabellenzeilen:
Zeile 1 -- Status x
Zeile 2 -- status x
Zeile 3 -- Status y
Zeile 4 -- Status z
Zeile 5 -- Status x

Die Zähler zeigen an:
x: 3     y: 1     z:1

Wenn ich Zeile 1 nun von x auf z ändere, sollen die Zähler anzeigen:
x: 2     y: 1     z:2

Ich habe bereits eine JavaScript Funktion geschrieben, in der das für ein SELECT funktioniert, die nur OK bzw. NOK zur Auswahl anbietet. Hier ist klar, welchen zähler ich inkrementieren und welchen dekrementieren muss.

Wie aber mach ich das im obigen Beispiel? Ich weiss zwar den nun ausgewählten Wert/Index, aber ich muss ja auch wissen, welchen Zähler ich dekrementieren muss, also brauche ich den Wert(Index VOR onchange().

Vielen Dank,
Dirk

[wahsaga]

hi,

Ich weiss zwar den nun ausgewählten Wert/Index, aber ich muss ja auch wissen, welchen Zähler ich dekrementieren muss, also brauche ich den Wert(Index VOR onchange().

Dann musst du ihn dir halt vorher schon merken.
Und nach dem die onchange-Verarbeitung abgeschlossen ist, merkst du dir wiederum den aktuellen Wert als "vorherigen" für's nächste Mal.

gruß,
wahsaga

[Dirk]

hi,

Ich weiss zwar den nun ausgewählten Wert/Index, aber ich muss ja auch wissen, welchen Zähler ich dekrementieren muss, also brauche ich den Wert(Index VOR onchange().

Dann musst du ihn dir halt vorher schon merken.
Und nach dem die onchange-Verarbeitung abgeschlossen ist, merkst du dir wiederum den aktuellen Wert als "vorherigen" für's nächste Mal.

gruß,
wahsaga

Danke. So etwas habe ich fast befürchtet, hatte aber gehofft, dass es 'eleganter' geht. Irgendwie so, dass man ein Event-Objekt hat, dass sowohl den vorherigen als auch den jetzigen Wert gespeichert hat. Naja, dann eben nicht. Danke nochmal.

[Dirk]

hi,

Ich weiss zwar den nun ausgewählten Wert/Index, aber ich muss ja auch wissen, welchen Zähler ich dekrementieren muss, also brauche ich den Wert(Index VOR onchange().

Dann musst du ihn dir halt vorher schon merken.
Und nach dem die onchange-Verarbeitung abgeschlossen ist, merkst du dir wiederum den aktuellen Wert als "vorherigen" für's nächste Mal.

gruß,
wahsaga

Mmmh, ich wollte es gerade mit 'nem hidden field versuchen:
Das SELECT hat zwar eine fixe Anzahl von Options, aber die Vorbelegung (selected=selected) erfolgt dynamisch, je nach Wert in der DB.
Wie kann ich dem hidden field nund den Index der selected option zuweisen?
<input type="hidden" value="?????????"/>

[wahsaga]

hi,

bitte zitiere sinnvoll, nur das worauf du konkret Bezug nimmst, Danke.

Das SELECT hat zwar eine fixe Anzahl von Options, aber die Vorbelegung (selected=selected) erfolgt dynamisch, je nach Wert in der DB.

Die Eigenschaft defaultSelected existiert.

gruß,
wahsaga

[Dirk]

hi,

bitte zitiere sinnvoll, nur das worauf du konkret Bezug nimmst, Danke.

Das SELECT hat zwar eine fixe Anzahl von Options, aber die Vorbelegung (selected=selected) erfolgt dynamisch, je nach Wert in der DB.

Die Eigenschaft defaultSelected existiert.

gruß,
wahsaga

Sorry. Wollte hier keinen Unmut hervorrufen.

Ok. defaultSelected ist dann die Option des SELECT-Elements, die beim Laden der Seite das selected-Attribut bekommt.
In einer for-Loop könnte ich über die Options laufen und erhielte somit den Index, um diesen ins hidden field zu speichern.

Wie aber bekomme ich beim Laden der Seite diesen Index in das hidden field (noch bevor ein User die Möglichkeit hat, die Auswahl zu ändern)?
Der Name bzw. die Id des hidden fields wird ebenso dynamisch erzeugt, wie der Name bzw. die Id des SELECT-Elements.

[Der Martin]

Hallo,

bitte zitiere sinnvoll, nur das worauf du konkret Bezug nimmst, Danke.
Sorry. Wollte hier keinen Unmut hervorrufen.

willst du uns veräppeln?
Oder warum sagst du sinngemäß, "sorry, is' klar", und klatscht trotzdem wieder das *komplette* Vorposting hier rein?

Ciao,
 Martin

[Dirk]

willst du uns veräppeln?
Oder warum sagst du sinngemäß, "sorry, is' klar", und klatscht trotzdem wieder das *komplette* Vorposting hier rein?

Mein Gott! Das waren in diesem Falle nur zwei Zeilen mehr, als wenn ich den restlichen Kladderadatsch rausgenommen hätte!

Hier meine Lösung für die Allgemeinheit. Vielleicht nicht JavaScript-Guru-Supercode, aber es funktioniert:

function updateCheckItemStatusCounter(openStateCounterFieldId,
           conditionStateCounterFieldId,
           hiddenField, selector)
{
 var oldIdx = 0;
 if ( document.getElementById(hiddenField).value == null || document.getElementById(hiddenField).value == '' )
 {
  for (var i=0; i<selector.options.length; i++)
  {
   if ( selector.options[i].defaultSelected == true )
   {
    oldIx = i;
   }
  }//end for i
 } else
 {
  oldIdx = document.getElementById(hiddenField).value;
 }

var idx = parseInt(selector.selectedIndex);
 var openNode = document.getElementById(openStateCounterFieldId);
 var conditionNode = document.getElementById(conditionStateCounterFieldId);
 var openCounter = parseInt(openNode.firstChild.nodeValue);
 var conditionCounter = parseInt(conditionNode.firstChild.nodeValue);

switch (parseInt(oldIdx))
 {
  case 0: if ( openCounter > 0 )
    {
     openCounter--;
    }
    break;
  case 1: if ( openCounter > 0 )
    {
     openCounter--;
    }
    if ( conditionCounter > 0 )
    {
     conditionCounter--;
    }
    break;
  case 2: if ( openCounter > 0 )
    {
     openCounter--;
    }
    if ( conditionCounter > 0 )
    {
     conditionCounter--;
    }
    break;
  case 3: if ( conditionCounter > 0 )
    {
     conditionCounter--;
    }
    break;
 }

switch (idx)
 {
  case 0: openCounter++;
    break;
  case 1: break;
  case 2: break;
  case 3: conditionCounter++;
    break;
 }

openNode.firstChild.nodeValue = openCounter;
 conditionNode.firstChild.nodeValue = conditionCounter;
 document.getElementById(hiddenField).value = idx;
}//end updateCheckItemStatusCounter

[wahsaga]

hi,

Mein Gott! Das waren in diesem Falle nur zwei Zeilen mehr, als wenn ich den restlichen Kladderadatsch rausgenommen hätte!

Es hätte gereicht, wenn du eine einzige Zeile - die, in der ich dich auf defaultSelected hingewiesen habe - zitiert hättest.
Gerne kann es natürlich auch mal etwas mehr sein, wenn du das für's Verständnis oder Bezugnehmen für erforderlich hältst.

Aber das Vorposting komplett zu Übernehmen, inklusive Begrüßung und Verabrschiedung, ist unnötig, und unschön zu lesen.
Man muss erst mal runterscrollen, um deine Aussagen zu finden, und ein konkreter Bezug ist meisten auch nicht erkennbar.

Also sei doch bitte so freundlich, und zitiere zukünftig etwas sinnvoller. Danke.

gruß,
wahsaga

[Dirk]

Also sei doch bitte so freundlich, und zitiere zukünftig etwas sinnvoller. Danke.

Wie Du siehst, komme ich ja damit klar.
Hauptsache, das ursprüngliche Problem ist gelöst und hilft hoffentlich auch noch den JavaScriptern.

[Struppi]

Hier meine Lösung für die Allgemeinheit. Vielleicht nicht JavaScript-Guru-Supercode, aber es funktioniert:

läßt sich natürlich schwer kontrollieren. Aber ich frag mich warum du es so umständlich machen willst. Du kannst doch jedesmal die anzeige neu berechnen, das sollte mit heutigen Computer in akzeptabler Geschwindigkeit ablaufen.

Meine Umsetzung würde ungefähr so aussehen:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
<head>  
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  
  <title></title>  
<script type="text/javascript">  
function count_status()  
{  
    var status = document.getElementsByName('status')  
  
    var sum = {};  
    // Alle Werte auf 0 setzen  
    var el;  
    for(var i = 0; el = status[0].options[i++];)  
    {  
         var val = el.value || el.text;  
         sum[val] = 0;  
    }  
    // alle Listen checken  
    for(var i = 0; el = status[i++];)  
    {  
        var val = el.options[el.selectedIndex].value || el.options[el.selectedIndex].text;  
        sum[val]++;  
    }  
    // und ausgeben  
    for(var feld in sum)  
    {  
       var out = document.getElementById(feld);  
       out.firstChild.data = sum[feld];  
    }  
}  
window.onload = function()  
{  
    var status = document.getElementsByName('status')  
    for(var i = 0; i < status.length; i++) status[i].onchange = count_status;  
    count_status();  
}  
</script>  
</head>  
  
<body>  
  
<form action="#">  
<p>  
x: <strong id="x">0</strong> y: <strong id="y">0</strong> z: <strong id="z">0</strong>  
</p>  
<table>  
<tr>  
<td> Zeile 1 </td> <td>  
<select name="status">  
<option>x </option> <option>y </option> <option>z </option>  
</select>  
</td>  
</tr>  
  
<tr>  
<td> Zeile 2 </td>  <td>  
<select name="status">  
<option>x </option> <option>y </option> <option>z </option>  
</select>  
</td>  
</tr>  
  
<tr>  
<td> Zeile 3 </td> <td>  
<select name="status">  
<option>x </option> <option>y </option> <option>z </option>  
</select>  
</td>  
</tr>  
  
<tr>  
<td> Zeile 4 </td>  
<td>  
<select name="status">  
<option>x </option> <option>y </option> <option>z </option>  
</select>  
</td>  
</tr>  
</table>  
</form>  
</body></html>

Struppi.

[wahsaga]

hi,

Wie aber bekomme ich beim Laden der Seite diesen Index in das hidden field (noch bevor ein User die Möglichkeit hat, die Auswahl zu ändern)?

Normalerweise per onload - dann sind alle Ressourcen geladen, und du kannst auf alles Zugreifen.

Könnte hier aber schon "zu spät" sein - sobald der Browser das Selectfeld gerendert hat, könnte der Nutzer etwas auswählen, und onload feuert ggf. erst später.

Dann könnte man den Scriptbereich direkt hinter dem Formular oder den Selects unterbringen - dann ist Scriptcode auslagern aber auch weniger günstig, denn der müsste ja auch erst mal wieder angefordert werden.

gruß,
wahsaga

[Dirk]

hi,

Ich weiss zwar den nun ausgewählten Wert/Index, aber ich muss ja auch wissen, welchen Zähler ich dekrementieren muss, also brauche ich den Wert(Index VOR onchange().

Dann musst du ihn dir halt vorher schon merken.
Und nach dem die onchange-Verarbeitung abgeschlossen ist, merkst du dir wiederum den aktuellen Wert als "vorherigen" für's nächste Mal.

gruß,
wahsaga

Mmmh, ich wollte es gerade mit 'nem hidden field versuchen:
Das SELECT hat zwar eine fixe Anzahl von Options, aber die Vorbelegung (selected=selected) erfolgt dynamisch, je nach Wert in der DB.
Wie kann ich dem hidden field nund den Index der selected option zuweisen?
<input type="hidden" value="?????????"/>

[Rouven]

Hello,

Wie aber mach ich das im obigen Beispiel? Ich weiss zwar den nun ausgewählten Wert/Index, aber ich muss ja auch wissen, welchen Zähler ich dekrementieren muss, also brauche ich den Wert(Index VOR onchange().

1. den alten Wert hält dir (meines Wissens) kein Browser vor.
2. damit bleiben zwei Möglichkeiten:
      a) rechne alle Zähler neu aus
      b) lege den alten Wert noch irgendwo ab solange du ihn noch brauchst, beispielsweise eine Variable oder ein hidden-Feld.

MfG
Rouven

[Struppi]

Wie aber mach ich das im obigen Beispiel? Ich weiss zwar den nun ausgewählten Wert/Index, aber ich muss ja auch wissen, welchen Zähler ich dekrementieren muss, also brauche ich den Wert(Index VOR onchange().

Einfach:

<select onfocus = " this.alt = this.selectedIndex"  
onchange = "alert('vorher wurde gewählt: '+ this.options[this.alt||0].value)">  

Struppi.