right code works fine code without static inputs 1 below if delete dropdown doesn't show here link test out http://89.69.172.125/cms2.0/
<script src="../leaguenotes/js/jquery.min.js"></script> <script src="../leaguenotes/js/champions_list.js"></script> <script src="dynamicforms.js"></script> <?php if(isset($_post['submit'])){ $x=1; foreach($_post['champion'] $champion){ echo $champion.'<br>'; if(!empty($_post['spelldescription'][$x])){ foreach($_post['spelldescription'][$x] $index=>$spelldescription){ echo $_post['change'][$x][$index].' '.$_post['championspell'][$x][$index].'<br>'; echo $spelldescription.' '.$_post['spellchange'][$x][$index].'<br><br>'; }} $x++; } }else{ ?> <a href="#" id="addchampion">add champion</a> <form name="second_form" id="second_form" method="post"> <div id="championinput"> <input type="text" class="championinput" list="champions" name="champion[]" placeholder="champion"> <datalist id="champions"></datalist> </div> <br><br> <input type="submit" name="submit"> </form> <?php } ?> $(document).ready(function(){ championnumber = 1; for(var key in champions){ if(champions.hasownproperty(key)){ $('#champions').append('<option value="' + key + '">'); }} $('a#addchampion').on('click',function(){ $('div#championinput').append( '<div class="champion" data-id="'+championnumber+'">\ <a href="#" class="remove">remove</a>\ <br>\ <input type="text" class="championinput" list="champions" name="champion[]" placeholder="champion '+championnumber+'">\ <datalist id="champions"></datalist>\ <a href="#" class="addspell">add spell</a>\ <a href="#" class="removespell">remove spell</a>\ <br>\ <div>'); championnumber++; }); $('div#championinput').on('click', 'a.remove',function(){ $(this).parent('div.champion').remove(); }); $('div#championinput').on('click', 'a.addspell',function(){ $(this).after( '<div class="spell">\ <select name="change['+$(this).parent('div').data('id')+'][]">\ <option value="passive">passive</option>\ <option value="q" selected>q</option>\ <option value="w">w</option>\ <option value="e">e</option>\ <option value="r">r</option>\ </select>\ <input type="text" name="championspell['+$(this).parent('div').data('id')+'][]">\ <br>\ <textarea type="text" size="20" name="spelldescription['+$(this).parent('div').data('id')+'][]" placeholder="enter description" />\ <select name="spellchange['+$(this).parent('div').data('id')+'][]">\ <option value="buff">buff</option>\ <option value="nerf">nerf</option>\ <option value="new">new</option>\ <option value="change">change</option>\ <option value="bugfix">bugfix</option>\ </select>\ <a href="#" class="addchange">add change </a>\ <a href="#" class="removespell">remove spell</a>\ </div>\ '); }); $('div#championinput').on('click', 'a.addchange',function(){ $(this).after( '<div class="change">\ <br>\ <textarea type="text" size="20" name="spelldescription['+$(this).parent('div').data('id')+'][]" placeholder="enter description" />\ <select name="spellchange['+$(this).parent('div').data('id')+'][]">\ <option value="buff">buff</option>\ <option value="nerf">nerf</option>\ <option value="new">new</option>\ <option value="change">change</option>\ <option value="bugfix">bugfix</option>\ </select>\ <a href="#" class="addchange">add change </a>\ <a href="#" class="removechange">remove change</a>\ </div>'); }); $('div#championinput').on('click', 'a.removespell',function(){ $(this).closest('.spell').remove(); }); $('div#championinput').on('click', 'a.removechange',function(){ $(this).closest('.change').remove(); }); });
Comments
Post a Comment