Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Is there a reason you cannot just remove the item you want to remove without rebuilding the control?</p> <p>Two methods below: One will remove the selected item. The other will remove an item based on its value. Assumes that your values for the options are unique.</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;head&gt; &lt;title&gt;&lt;/title&gt; &lt;script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div&gt; &lt;select id="example"&gt; &lt;option value="1"&gt;First&lt;/option&gt; &lt;option value="2"&gt;Second&lt;/option&gt; &lt;option value="3"&gt;Third&lt;/option&gt; &lt;/select&gt;&lt;/div&gt; &lt;div&gt; &lt;a href="javascript:;" id="remove"&gt;Remove Selected&lt;/a&gt;&lt;/div&gt; &lt;div&gt; &lt;a href="javascript:;" id="removeSecond"&gt;Remove Second&lt;/a&gt;&lt;/div&gt; &lt;script type="text/javascript"&gt; $(function () { $("#remove").click(function () { var select = $("#example"); var selected = select.find(":selected"); selected.remove(); }); $("#removeSecond").click(function () { var select = $("#example"); var second = select.find("[value=2]"); second.remove(); }); }); &lt;/script&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p><strong>EDIT:</strong></p> <p>Does this do what you want? Instead of empty, I call $select.find("[value!=0]").remove(); and that seems to match the behaviour you're describing.</p> <pre><code>// Build a javascript array with all of the select names/values var options = new Array(); $('#Questions1 option:not(:first)').each(function() { $this = $(this); options.push({ Name: $this.text(), Value: $this.val() }); }); // Create a function for re-building a select minus the chosen option var rebuildSelect = function($selOption, $select) { $previouslySelected = $select.find(':selected'); $select.find("[value!=0]").remove(); for (var i = 0; i &lt; options.length; i++) { var opt = options[i]; if (opt.Value != $selOption.val()) { if ($previouslySelected.val() == opt.Value) { $select.append('&lt;option value="' + opt.Value + '" selected="selected"&gt;' + opt.Name + '&lt;/option&gt;'); } else { $select.append('&lt;option value="' + opt.Value + '"&gt;' + opt.Name + '&lt;/option&gt;'); } } } } // Wire up the event handlers var $Questions1 = $('#Questions1'); var $Questions2 = $('#Questions2'); $Questions1.change(function() { rebuildSelect($(this), $Questions2); }); $Questions2.change(function() { rebuildSelect($(this), $Questions1); }); // Go ahead and run the function once to remove the default entry from the second box rebuildSelect($Questions1.find(':selected'), $Questions2); </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

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