Note that there are some explanatory texts on larger screens.

plurals
  1. POSelecting an option will select an other option
    primarykey
    data
    text
    <p>For example, if you select the option with <code>id="chocolate-yes"</code> or <code>id="vanilla-yes"</code>, the the option with <code>id="icecreamcone-yes"</code> will also be selected.</p> <p><br/> Anyone know of a Javascript that can do this?<br/> <br/></p> <p><strong><em>Note 1: the option with <code>id="sprinkles-yes"</code> will not effect <code>id="icecreamcone-yes"</code>.<br/> Note 2: id names cannot be changed, nor can you add more properties to the elements.<br/> Note 3: cannot use jQuery.</em></strong><br/> <br/></p> <pre><code>&lt;ul id="icecream" style="list-style:none;line-height:30px;"&gt; &lt;li&gt; &lt;select id="icecreamcone"&gt; &lt;option value="addicecreamcone"&gt;Would you like an ice cream cone?&lt;/option&gt; &lt;option id="icecreamcone-yes" value="yes"&gt;Yes&lt;/option&gt; &lt;option id="icecreamcone-no" value="no"&gt;No thanks&lt;/option&gt; &lt;/select&gt; &lt;/li&gt; &lt;li&gt; &lt;select id="vanilla"&gt; &lt;option value="addvanilla"&gt;Would you like to add vanilla ice cream?&lt;/option&gt; &lt;option id="vanilla-yes" value="yes"&gt;Yes&lt;/option&gt; &lt;option id="vanilla-no" value="no"&gt;No thanks&lt;/option&gt; &lt;/select&gt; &lt;/li&gt; &lt;li&gt; &lt;select id="chocolate"&gt; &lt;option value="addchocolate"&gt;Would you like to add chocolate ice cream?&lt;/option&gt; &lt;option id="chocolate-yes" value="yes"&gt;Yes&lt;/option&gt; &lt;option id="chocolate-no" value="no"&gt;No thanks&lt;/option&gt; &lt;/select&gt; &lt;/li&gt; &lt;li&gt; &lt;select id="sprinkles"&gt; &lt;option value="addsprinkles"&gt;Would you like to add sprinkles on top?&lt;/option&gt; &lt;option id="sprinkles-yes" value="yes"&gt;Yes&lt;/option&gt; &lt;option id="sprinkles-no" value="no"&gt;No thanks&lt;/option&gt; &lt;/select&gt; &lt;/li&gt; &lt;/ul&gt; </code></pre> <p><img src="https://i.stack.imgur.com/9vR78.gif" alt=""></p>
    singulars
    1. This table or related slice is empty.
    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. 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