Formularfelder ausgrauen

[einneuer]

Hallo

Ich habe vier Tabellenzellen nebeneinander, in denen jeweils ein formularfeld drin ist. Und das javascript.

Den ersten beiden formularfeldern habe ich jeweils die gleiche ID gegeben (was aber nun nicht funktioniert) und den letzten beiden auch, damit wenn ich in das erste oder zweite feld etwas eingebe, soll das dritte und vierte "ausgegraut" werden bzw. wenn ich in das dritte oder vierte etwas eingebe, sollen das erste und zweite "ausgegraut" werden. Es funktioniert aber immer nur bei dem ersten bzw. dritten. Heißt: Wenn ich in das erste o. zweite feld etwas eingebe, wird nur das dritte "ausgegraut" und nicht das vierte ebenfalls, obwohl es den gleichen Namen hat! Genauso sieht es andersrum aus: Wenn ich in das dritte oder vierte etwas eingebe, wird nur das erste "ausgegraut".

So sieht das javascript und der Aufruf aus:

<script type="text/javascript">
function disable_element(src_elm,elm_id) {
  elm = document.getElementById(elm_id);
  if (src_elm.value != "") {
    elm.setAttribute("disabled","disabled");
  }
  else {
    elm.removeAttribute("disabled");
  }
}

</script>

<input type=\"text\" onchange=\"disable_element(this,'g1');\" id=\"h1\" name=\"torh1\" size=\"1\"> 
<input type=\"text\" onchange=\"disable_element(this,'g1');\" id=\"h1\" name=\"goalh1\" size=\"20\"> 
<input type=\"text\" onchange=\"disable_element(this,'h1');\" id=\"g1\" name=\"torg1\" size=\"1\"> 
<input type=\"text\" onchange=\"disable_element(this,'h1');\" id=\"g1\" name=\"goalg1\" size=\"20\">

Hoffe ihr könnt mir weiter helfen, wie ich es richtig machen muss. Danke

 

[kumil]

Das Problem hierbei ist ID.


Es ist so wenn du eine id vergibst, gilt das nur für ein Element. Deshalb wird das erste Element, mit der entsprechenden ID "ausgegraut, das zweite, welches die selbe ID hat nicht, da es ignoeriet wrid.

JS ist nicht wirklich gut im selbstständigen denken, wenn es also einmal was gefunden hat, wo die ID passt sucht es nicht weiter ob die ID nochmal vergeben wurde.

...

Nachtrag:

versuche mal die zusamgehörigen Felder in einen Container zu setzten und gib dem mal die ID das könnte gehen.

<div id="h1">
 
</div>

hab es jetzt nicht ausprobiert...

wie gesagt es liegt an den IDs, ansonsten wäre da noch die möglichkeit mit vieren zu arbeiten und die dann namentlich anzusprechen....

 

[Quaese]

Hi,

eine weitere Möglichkeit wäre, den Textfeldern name-Attribute zuzuweisen. Dann können
über die Methode getElementsByName alle Elemente mit dem gleichen Namen ermittelt
werden. Um die Auswertung in späteren CGI-Scripten zu ermöglichen, sollten Namen der
Form "name[]" verwendet werden.

Das Script könntest du folgendermassen anpassen:

function disable_element(src_elm, elm_name) {
  elm = document.getElementsByName(elm_name);

  // Alle Textfelder einer Namensgruppe durchlaufen
  for(i=0; i<elm.length; i++){
    if (src_elm.value != "") {
      elm[i].disabled = true;
    }else{
      elm[i].removeAttribute("disabled");
    }
  }
}

Mögliche HTML-Quelle:

<table>
  <tr>
    <td><input type="text" name="txt_1[]" onkeyup="disable_element(this, 'txt_2[]');" value="" /></td>
    <td><input type="text" name="txt_1[]" onkeyup="disable_element(this, 'txt_2[]');" value="" /></td>
    <td><input type="text" name="txt_2[]" onkeyup="disable_element(this, 'txt_1[]');" value="" /></td>
    <td><input type="text" name="txt_2[]" onkeyup="disable_element(this, 'txt_1[]');" value="" /></td>
  </tr>
</table>

Ciao
Quaese