HTML : when one dropdown is selected , a checkbox appears

Question

I'm working on a HtML page , where I have a dropdown menu , which has three options

Value :<select id="tagid_1">
<option value="tagAll">tagAll</option> 
<option value="untagAll">untagAll</option>
<option value="UnTagPvid">untagPvidOnly</option></select>

I want something where if the user select the dropdown tagAll , one checkbox dynamically appears e.g. want VLACP

Again, if the user select untagAll, two checkbox appears , one checkbox e.g want STP , second checkbox want SLPP.

Is there anyway , I can do this with HTML.

If can;t be done in pure HTML , it will be helpful if someone can share javascript code for this.

Thanks in advance.

You will need some javascript code? I dont think pure html can do that — Felix Cen, Dec 31 '15 at 16:49
Please google this first. You could look for dynamic html manipulating, DOM, jQuery, etc. Check this for a beginning: http://www.w3schools.com/jquery/default.asp — Ehsan88, Dec 31 '15 at 16:51
please provide a minimal code example and expand more on what you want exactly — cocoa, Dec 31 '15 at 16:51
@EhsanAbd ..I never played with jquery ...any html or javascript will be helpful — user3185596, Dec 31 '15 at 16:53
@FelixCen: Do you care to share any javascript code , if you know . thanks — user3185596, Dec 31 '15 at 16:54
Questions seeking debugging help ("why isn't this code working?") must include the desired behavior, a specific problem or error and the shortest code necessary to reproduce it in the question itself. Questions without a clear problem statement are not useful to other readers. Please visit the [help] and also read [ask]. — Jim Garrison, Dec 31 '15 at 16:55

Anil Panwar · Answer 1 · 2015-12-31T17:01:53.023

1

Suppose your select list is as :

<div id="appendCheckbox"></div>// will append here checkbox dynamically

 <select>
   <option value=1> text</option>
    <option value=2> text2</option>
</select>

Jquery as

  $('Select').change
       (function(){
     var value = $(this).val();
      If(value ==1){
        // first remove previously appended checkbox.
          $("#appendCheckbox").html();


        $("#appendCheckbox").append("text <input type="checkbox" value=1/>");}
    If(value ==2){
      // here append two input
     } 
  });

edited Dec 31 '15 at 17:01

answered Dec 31 '15 at 16:58

Anil Panwar

2,518
1
10
24

This link might help you better http://stackoverflow.com/questions/30405585/how-to-get-clicked-option-from-a-selectmultiple-in-internet-explorer to get it done with javascript – Anil Panwar Dec 31 '15 at 17:10

HTML : when one dropdown is selected , a checkbox appears

1 Answers1