Add dynamic fields through jQuery in wordpress

<ul class=”skills row0″>
<li><input type=”text” class=”sm-txt” name=”skill” placeholder=”Skill” value=”<?php echo get_option(‘skill’); ?>”/></li>
<li><input type=”text” class=”sm-txt” name=”bgcolor” placeholder=”Color Code” value=”<?php echo get_option(‘bgcolor’); ?>”/></li>
<li><input type=”text” class=”sm-txt” name=”percentage” placeholder=”Percentage” value=”<?php echo get_option(‘percentage’); ?>”/></li>
<div class=”add”>
<span><img class=”add-more” src=”<?php echo get_template_directory_uri();?>/images/admin/add.png” />
<input type=”hidden” name=”current”  id=”current” value=”0″/>



//add and remove slill
var cid = jQuery(‘#current’).val();
var nextId = parseInt(cid)+1;
jQuery(this).before(‘<ul class=”skills row’+nextId+'”><li><input type=”text” class=”sm-txt” name=”skill[]” placeholder=”Skill” value=””/></li><li><input type=”text” class=”sm-txt” name=”bgcolor[]” placeholder=”Color Code” value=””/></li><li><input type=”text” class=”sm-txt” name=”percentage[]” placeholder=”Percentage” value=””/></li><li><span><img id=”‘+nextId+'” class=”remove” src=”<?php echo get_template_directory_uri();?>/images/admin/ico-delete.png” /></span></li></ul>’);

var $ID = jQuery(this).attr(‘id’);


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s