javascript - ajax / codeigniter out put create a new row every 4 columns -
in success part of ajax each result gets put columns.
what trying achive every 4 columns create new row.
question: on success part of ajax how make every after every 4 columns create new row?
<script type="text/javascript"> $("#select_category").on('keyup', function(e) { $.ajax({ type: "post", url: "<?php echo base_url('questions/displaycategories');?>", data: { category: $("#select_category").val() }, datatype: "json", success: function(json){ list = ''; list += '<div class="row">'; $.each(json['categories'], function(key, value ) { list += '<div class="col-sm-3">'; list += value['name']; list += '</div>'; }); list += '</div>'; $('.category-box').html(list); } }); }); </script>
you count how many you've added , insert new row each time reaches 4:
$("#select_category").on('keyup', function(e) { $.ajax({ type: "post", url: "<?php echo base_url('questions/displaycategories');?>", data: { category: $("#select_category").val() }, datatype: "json", success: function(json) { var list = '<div class="row">'; var index = 0; $.each(json['categories'], function(key, value) { list += '<div class="col-sm-3">'; list += value['name']; list += '</div>'; index++; if(index === 4) { list += '</div><div class="row">'; index = 0; } }); list += '</div>'; $('.category-box').html(list); } }); });
Comments
Post a Comment