Databases
StackOverflow2013
Postsdbo
POAdding/Deleting Options Fails in Firefox Only
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAdding/Deleting Options Fails in Firefox Only
    text
    copied!<p>I have a simple webpage that adds &amp; deletes options from a select element dynamically. The code works correctly for Chrome &amp; IE, but it fails in Firefox(when I click add nothing happens &amp; the delete button doesn't even show up?)</p> <p><strong>What do you think I am doing wrong?</strong></p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;&lt;!-- InstanceBegin template="/Templates/homepage.dwt" codeOutsideHTMLIsLocked="false" --&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; &lt;title&gt;&lt;/title&gt; &lt;script LANGUAGE="JavaScript" type = "text/javascript"&gt; &lt;!-- function addOption() { var listbox = document.getElementById( "listbox" ); var lastIndex = listbox.options.length-1; var newOption = document.createElement( "option" ); newOption.text = "New"; newOption.value = "New"; try { listbox.add( newOption, lastIndex ); // standards compliant; doesn't work in IE } catch (ex) { listbox.add( newOption, listbox.selectedIndex ); // IE only alert( "In addOption(): " + ex ); } } function deleteOption() { //alert( "1" ); var listbox = document.getElementById( "listbox" ); var lastIndex = listbox.options.length-1; if ( lastIndex &lt; 0 ) return; listbox.remove( lastIndex ); //alert( "2" ); } --&gt; &lt;/script&gt; &lt;style type="text/css" media="all"&gt; &lt;!-- div { text-align: center; } button { width: 100px; height: 20px; } #listbox { width: 200px; height: 200px; --&gt; &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;div&gt; &lt;select id="listbox" multiple="multiple"&gt; &lt;option&gt;Test&lt;/option&gt; &lt;/select&gt; &lt;button value="Add" onclick="addOption()"/&gt; &lt;button value="Delete" onclick="deleteOption()"/&gt; &lt;/div&gt; &lt;/body&gt; &lt;!-- InstanceEnd --&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload