javascript - Cannot dynamically create select with its options -
i tried dynamically create div select input inside turns out there empty div noting.
as can see, $edurow div used container. trying solve in many ways still not working(always came empty div).
i have clicking button dynamically create these select stuff after click.
here function that's written inside document ready function.
$("#addmoreedu").on('click', function() { var $edurow = $("#edu-row"); var select = $('<select />', { 'class': 'selectoption' }); $(select).append($('<option value="" disabled selected>degree option</option>')); $(select).append($('<option value="1">high school</option>')) $(select).append($('<option value="2">college</option>')) $(select).append($('<option value="3">bachelors degree</option>')) var div = $('<div />', { 'class': 'input-field col s12 m4 l4' }); $(div).append(select) $edurow.append(div); $edurow.append('<div class="input-field col s12 m4 l8"><span class="fieldlabel"> institutes name</span><input placeholder="institutes name" id="intsname" type="text" /></div>'); });
another weird thing second append works fine. think there must problem select :\ ideas?
note: have code herecodepen if can take @ educational background section.
i have ran code in blank project , works. change made wrap code in $(document).ready(function () { code here });
construct. suggest may have issue either selector, or script inclusion jquery.
try putting debugger;
line in , running debug tools going (f12)
Comments
Post a Comment