Clever Geek Handbook

Jquery multiple flexible checkboxes check and show textbox

I have some flexible checkboxes that all checkboxes are written from the database. I want to do this, when I have checked any checkbox, it will show the textbox below that checkbox.

here is my page layout

enter image description here

The screenshot now shows all text fields, by default all text fields should be hidden.

here is my code

<?php $no = 0; if(isset($skill_records)) : foreach($skill_records as $row) : $no++; ?>

<div class="checkbox">
<label>
<input type="checkbox" value="<?php echo $row->skillid; ?>" name="skillid[]"  id="skillid<?php echo $no; ?>"  <?php echo set_checkbox('skillid[]', $row->skillid); ?>>
<?php echo $row->skill; ?>
</label>
</div>
<div class="col-md-3" style="display:none;">
<input type="text" value="" name="score[]" class="score input-sm form-control" id="score<?php echo $no; ?>" placeholder="Score"  >
</div>
<?php endforeach; ?>
<?php endif; ?>

As you can see my textbox is already set as display:none

Any idea how to do this - JQuery?

thank

+3


source to share


2 answers


try

$("input[type=checkbox]").change(function () {
    $(this).closest("div").next().toggle(this.checked);
});


DEMO

+3


source 


$('li').change(function(){

var target = $(this).closest('li').find('.CLASS_OF_INPUT');

if (this.checked) {
        target.show();
    }

});


0


source






More articles:


All Articles