Actually I'm using laravel
framework.In which I use certain queries and methods to retrieve data from database..
And its my code below
<ul class="booking-list">
@foreach($aRooms as $aRoom)
<li>
....
<div class="comment more">
{{$aRoom->room_desc}}
</div>
....
</li>
@endforeach
</ul>
There are many contents to display like {{$aRoom->room_desc}}
.But by using this {{$aRoom->room_desc}}
I have to set the Read more
Read less
toggle option.
I don't know how to set that using jQuery,if the data is from database
And here is my jQuery,
<script>
$(document).ready(function() {
var showChar = 100;
var ellipsestext = "...";
var moretext = "More (+)";
var lesstext = "Less (-)";
$('.more').each(function() {
var content = $(this).html();
if(content.length > showChar) {
var c = content.substr(0, showChar);
var h = content.substr(showChar-1, content.length - showChar);
var html = c + '<span class="moreelipses">'+ellipsestext+'</span> <span class="morecontent"><span>' + h + '</span> <a href="" class="morelink">'+moretext+'</a></span>';
$(this).html(html);
}
});
$(".morelink").click(function(){
if($(this).hasClass("less")) {
$(this).removeClass("less");
$(this).html(moretext);
} else {
$(this).addClass("less");
$(this).html(lesstext);
}
$(this).parent().prev().toggle();
$(this).prev().toggle();
return false;
});
});
</script>
Thanks,