$.each()
doesn’t return what the callback function does, you need to use $.map
, then .join()
to combine all the results back into a string.
But a simpler way is to take the loop out of the concatenation, and instead append to the string in the loop.
var htmlString = '<section class="content-header"><h1>Employee</h1></section><!-- Main content --><section class="content"><div class="row"><div class="col-xs-12"><div class="box"><div class="row" style="margin:10px">';
$.each( res['data'], function( key, value ) {
htmlString += '<div class="col-md-3"><!-- Widget: user widget style 1 --><div class="box box-widget widget-user"><!-- Add the bg color to the header using any of the bg-* classes --><div class="widget-user-header" style="background-color: red;color:#fff"><h3 class="widget-user-username">Soundharajan</h3><h5 class="widget-user-desc">Manager</h5></div><div class="widget-user-image"><img class="img-circle" src="https://stackoverflow.com/questions/37077011/TV/php/upload/unknown-img.jpg" alt="User Avatar"></div><div class="box-footer"><div class="row"><div class="col-sm-6 border-right"><div class="description-block"><h5 class="description-header">9862626427</h5><span class="description-text">Mobile</span></div><!-- /.description-block --></div><!-- /.col --><div class="col-sm-6"><div class="description-block"><h5 class="description-header">BE</h5><span class="description-text">Education</span></div><!-- /.description-block --></div><!-- /.col --></div><!-- /.row --></div><button type="button" data-loading-text="Loading..." class="btn btn-primary btn-block view_employee" style="background-color: red;color:#fff;border-color:red"> View Task </button></div><!-- /.widget-user --></div>';
});
htmlString += '</div></div></div></div></section><!-- /.section -->';
1
solved How to write the for loop in javascript [closed]