Stack Overflow Asked by user11916445 on December 6, 2020
how can I do when I have a read more function in a foreach and give load more to give me load based on id?
I tried like that but it doesn’t work
<p class="public-project-paragraph" style="font-weight: normal;">
{{ Str::limit($dvns->news, 3, '') }}
@if (strlen($dvns->news) > 3)
<span id="dots-{{ $dvns->id }}">...</span>
<span id="more" style="display: none;">{{ substr($dvns->news, 50) }}</span>
@endif
</p>
<button type="button" class="btn btn-primary btn-sm" onclick="loadMore()" id="myBtn">Read More</button>
function loadMore() {
var id;
var dots = document.getElementById("dots" + id);
var moreText = document.getElementById("more");
var btnText = document.getElementById("myBtn");
if (dots.style.display === "none") {
dots.style.display = "inline";
btnText.innerHTML = "Read more";
moreText.style.display = "none";
} else {
dots.style.display = "none";
btnText.innerHTML = "Read less";
moreText.style.display = "inline";
}
}
And I also get the error
Cannot read property 'style' of null
Any idea how I could go on?
Try adding the id to the function call (i'm assuming it's an integer)
<p class="public-project-paragraph" style="font-weight: normal;">
{{ Str::limit($dvns->news, 3, '') }}
@if (strlen($dvns->news) > 3)
<span id="dots-{{ $dvns->id }}">...</span>
<span id="more-{{ $dvns->id }}" style="display: none;">{{ substr($dvns->news, 50) }}</span>
@endif
</p>
<button type="button" class="btn btn-primary btn-sm" onclick="loadMore({{ $dvns->id }})" id="myBtn">Citeste mai mult</button>
Then use it as a parameter
function loadMore(id) {
var dots = document.getElementById("dots-" + id);
var moreText = document.getElementById("more-" + id);
if (moreText.style.display === "none") {
moreText.style.display = "inline";
dots.style.display = "none";
} else {
moreText.style.display = "none";
dots.style.display = "inline";
}
}
Correct answer by N69S on December 6, 2020
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP