Aline: IE vergisst den Text

Hi!

ich habe wieder ein merkwürdiges Internet Explorer Problem...

Warum vergisst der Internet Explorer den Text, wenn auf die Dropdownbox mehr als 1 mal geklickt wird?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="de" xml:lang="de">  
<head>  
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />  
<title>Test</title>  
<script type="text/javascript">
// <![CDATA[  
var dummyOptions = new Array();  
  
function createDummyOptions(obj){  
  var optgroups = obj.getElementsByTagName("optgroup");  
  var options;  
  var newEntry;  
  
  if(dummyOptions.length != optgroups.length){  
    for (var i = 0; i < optgroups.length; i++){  
      options = optgroups[i].getElementsByTagName("option");  
  
      newEntry = document.createElement("option");  
      newEntry.appendChild(document.createTextNode(options[0].text));  
      newEntry.value = options[0].value;  
  
      dummyOptions.push(newEntry);  
    }  
  }  
}  
  
function deleteDummyOption(obj){  
  var optgroups = obj.getElementsByTagName("optgroup");  
  var counter = 0;  
  var options;  
  
  for (var i = 0; i < optgroups.length; i++){  
    options = optgroups[i].getElementsByTagName("option");  
    counter += options.length;  
  
    if(options.length == 1){  
      obj.options[counter-1] = null;  
    }  
  }  
}  
  
function restoreDummyOptions(obj){  
  var optgroups = obj.getElementsByTagName("optgroup");  
  var counter = 0;  
  var options;  
  
  for (var i = 0; i < optgroups.length; i++){  
    options = optgroups[i].getElementsByTagName("option");  
    counter += options.length;  
  
    if(options.length == 0){  
      optgroups[i].appendChild(dummyOptions[i]);  
      alert(obj.options[counter].value + " " + obj.options[counter].text);  
    }  
  }  
}  
// ]]>
</script>  
</head>  
<body onload="createDummyOptions(document.forms[0].list)">  
  <form method="post" action="">  
    <p>  
      <select name="list" size="15" onclick="deleteDummyOption(this, 1); restoreDummyOptions(this);">  
        <optgroup label="Test">  
          <option value="test">TEST</option>  
        </optgroup>  
      </select>  
    </p>  
  </form>  
</body>  
</html>

Opera und Firefox sind nicht so vergesslich

Aline

  1. Hallo,

    Warum vergisst der Internet Explorer den Text, wenn auf die Dropdownbox mehr als 1 mal geklickt wird?

    So richtig habe ich nicht verstanden, was Du eigentlich erreichen willst.

    Allerdings würde ich im DOM nicht einfach ein Element gleich null setzen. Um Elemente zu entfernen gibt es http://de.selfhtml.org/javascript/objekte/node.htm#remove_child@title=removeChild().

    function deleteDummyOption(obj){
      var optgroups = obj.getElementsByTagName("optgroup");
      var counter = 0;
      var options;

    for (var i = 0; i < optgroups.length; i++){
        options = optgroups[i].getElementsByTagName("option");
        counter += options.length;

    if(options.length == 1){
          //obj.options[counter-1] = null;

    optgroups[i].removeChild(options[counter-1]);

    }
      }
    }

      
    viele Grüße  
      
    Axel
    
    1. Hi!

      Warum vergisst der Internet Explorer den Text, wenn auf die Dropdownbox mehr als 1 mal geklickt wird?
      So richtig habe ich nicht verstanden, was Du eigentlich erreichen willst.

      ich habe bei jeder optgroup eine Standardoption, die entfernt werden soll, wenn eine option unterhalb dieser optgroup hinzugefügt wird. Werden alle option einer optgroup entfernt, soll die Standardoption automatisch wieder eingefügt werden.

      Mein Beispiel ist stark gekürzt, zeigt jedoch das fehlerhafte Verhalten des IEs.

      Allerdings würde ich im DOM nicht einfach ein Element gleich null setzen

      ich hab das Beispiel aus selfhtml entnommen

      Um Elemente zu entfernen gibt es http://de.selfhtml.org/javascript/objekte/node.htm#remove_child@title=removeChild().

      function deleteDummyOption(obj){
        var optgroups = obj.getElementsByTagName("optgroup");
        var counter = 0;
        var options;

      for (var i = 0; i < optgroups.length; i++){
          options = optgroups[i].getElementsByTagName("option");
          counter += options.length;

      if(options.length == 1){
            //obj.options[counter-1] = null;
               optgroups[i].removeChild(options[counter-1]);
          }
        }
      }

      »»»»

      wenn eine Dropdownbox 2 optgroups hat, wird ein Fehler geworfen, wenn die Kinder der 2. optgroup entfernt werden  
        
      Iceweasel:  
      
      > [Exception... "Component returned failure code: 0x80004003 (NS\_ERROR\_INVALID\_POINTER) [nsIDOMHTMLOptGroupElement.removeChild]"  nsresult: "0x80004003 (NS\_ERROR\_INVALID\_POINTER)"  location: "JS frame :: http://localhost:8888/script.js :: anonymous :: line 387"  data: no]  
      > http://localhost:8888/script.js  
      > Line 387  
        
      Opera 10.00 Beta 2 (Build 4520):  
      
      > JavaScript - http://localhost:8888/:export-profiles.html  
      > Unknown thread  
      > Error:  
      > name: Error  
      > message: WRONG\_ARGUMENTS\_ERR  
      > stacktrace: n/a; see  opera:config#UserPrefs|Exceptions Have Stacktrace  
        
        
      Internet Explorer:  
      
      > Webpage error details  
      >  
      > User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729)  
      > Timestamp: Sun, 2 Aug 2009 07:59:14 UTC  
      >  
      > Message: Type mismatch.  
      >  
      > Line: 387  
      > Char: 9  
      > Code: 0  
      > URI: http://new:8888/script.js  
        
        
      Zeile 387 ist folgende:  
      `optgroups[i].removeChild(options[counter-1]);`{:.language-javascript}  
        
      Wenn ich statt "`optgroups[i].removeChild(options[counter-1]);`{:.language-javascript}" das Element wie folgt entferne "`obj.options[counter-1] = null;`{:.language-javascript}" funktioniert das entfernen und einfügen einer anderen Option  
        
      Aline
      
      1. Hi!

        ich habe den Fehler entdeckt

        function deleteDummyOption(obj){  
          var optgroups = obj.getElementsByTagName("optgroup");  
          var counter = 0;  
          var options;  
          
          for (var i = 0; i < optgroups.length; i++){  
            options = optgroups[i].getElementsByTagName("option");  
            counter += options.length;  
          
            if(options.length == 1){  
              //obj.options[counter-1] = null;  
              optgroups[i].removeChild(obj.options[counter-1]);  
              //                       ^^^  
            }  
          }  
        }
        

        jetzt funktioniert es :)

        Aline