globe: options in selectfeld einfügen - FireFox Bug

Beitrag lesen

n'abend,

function refreshSelect(selectField)
   {
    selectField.innerHTML = '<option value="55">new 55</option>'
           + '<option value="66">new 66</option>'
           + '<option value="77">new 77</option>'
           + '<option value="88" selected="selected">new 888888</option>'
           + '<option value="99">new 99</option>'
           + '<option value="1223">originally selected</option>';

}

Gott gab uns das DOM und sprach: »Dies sei eure neue Religion«.

/**  
 * Befülle eine Auswahlliste mit neuen Optionen  
 * @param field Node, deren Kinder entfernt werden sollen  
 * @param options Array von Optionen: [ {text:"Bezeichnung", value:"Wert", selected:true}, … ]  
 * @return field-node aus der Eingabe  
 */  
function addOptions( field, options )  
{  
  for( var i=0, option; option = options[i]; i++ )  
  {  
    // neues <option> Element erstellen  
    var opt = document.createElement( 'option' );  
  
    // <option value="xyz"> zuweisen  
    opt.value = option.value;  
  
    // <option selected> zuweisen  
    // option.selected könnte nicht gesetzt sein, wäre also "undefined", das ist hier nur just in case...  
    opt.selected = option.selected ? true : false;  
  
    // <option>xyz</option> zuweisen  
    opt.appendChild( document.createTextNode( option.text ) );  
  
    // neue Option ins <select> einklinken  
    field.appendChild( opt );  
  }  
  
  // zur Verkettung von Aufrufen  
  return field;  
}  
  
/**  
 * Lösche alle Option-Elemente einer Auswahlliste  
 * @param field Node, deren Kinder entfernt werden sollen  
 * @return field-node aus der Eingabe  
 */  
function emptyOptions( field )  
{  
  while( field.childNodes.length > 0 )  
    field.removeChild( field.childNodes[0] );  
  
  // zur Verkettung von Aufrufen  
  return field;  
}

Wenn du nun also deine Liste aktualisieren möchtest, kannst du einfach das folgende ausführen:

function refreshSelect( field )  
{  
  // bestehende Optionen löschen  
  emptyOptions( field );  
  // neue Options hinzufügen  
  addOptions( field, [  
    { text:"new 55", value:"55" },  
    { text:"new 66", value:"66" },  
    { text:"new 77", value:"77" },  
    { text:"new 888888", value:"88", selected:true},  
    { text:"new 99", value:"99" },  
    { text:"originally selected", value:"1223" }  
  
  ] );  
  
  return field;  
}

natürlich kannst du vor dem Löschen der Optionen schauen welche Option ausgewählt war und die eine oder andere Option speichern, damit sie neu eingetragen wird, etc. etc.

<select onmclick="refreshSelect(this)">

ist das ein Tippfehler, oder ein mir nicht bekannter EventHandler »onmclick«?

</html>

weiterhin schönen abend...

--
#selfhtml hat ein Forum?
sh:( fo:# ch:# rl:| br:> n4:& ie:{ mo:} va:) de:] zu:} fl:( ss:? ls:[ js:|