Oh no! Where's the JavaScript?
Your Web browser does not have JavaScript enabled or does not support JavaScript. Please enable JavaScript on your Web browser to properly view this Web site, or upgrade to a Web browser that does support JavaScript.
Not a member yet? Click here to register.
Forgot Password?

Readmore Functions

Asked Modified Viewed 1,287 times
G
Grimloch
G
Energy can neither be created nor destroyed; only transformed !
  • Senior Member, joined since
  • Contributed 722 posts on the community forums.
  • Started 141 threads in the forums
  • Started this discussions
  • Answered 2 questions
asked
Senior Member

OK guys I have a new thing I'm working on. In my grims_blog infusion on my site, I have implemented a jQuery Readmore function. I have discovered after much experimentation and reading hundreds of posts and searches on the web, that jQuery will only output pure text (NO HTML - all formatting is lost) so my question is this. Is there anyway that a readmore function (by any method) will honor html within the text? I suspect the answer will be no but thought I'd ask anyway.
My site:
https://whisperwillow.net/infusions/g.../index.php
...in case you'd like to take a look.
Edited by Grimloch on 05-01-2021 15:30,
0 replies

7 posts

D
douwe_yntema
D
  • Senior Member, joined since
  • Contributed 667 posts on the community forums.
  • Started 57 threads in the forums
  • Answered 1 question
answered
Senior Member

Mostly used is a jQuery script executing a PHP file when triggered. The PHP-file output is put in a part of the screen.

See here: https://www.codexworld.com/bootstrap-modal-popup-form-submit-jquery-ajax-php/
0 replies
G
Grimloch
G
Energy can neither be created nor destroyed; only transformed !
  • Senior Member, joined since
  • Contributed 722 posts on the community forums.
  • Started 141 threads in the forums
  • Started this discussions
  • Answered 2 questions
answered
Senior Member

I really don't understand how that can help me; I don't want a popup window or modal. I want the article to expand to read the rest. Please take a look at my blog. As it is all formatting is lost and it displays only text but it's all run together. It wo't allow line breaks or any kind of html formatting.
1 reply
G
Grimloch
G
Energy can neither be created nor destroyed; only transformed !
  • Senior Member, joined since
  • Contributed 722 posts on the community forums.
  • Started 141 threads in the forums
  • Started this discussions
  • Answered 2 questions
answered
Senior Member

Thanks guys. Total complete success !!! Check out https://whisperwillow.net/infusions/grims_blog/index.php ... I simply modified the jQuery function I already had in place. I replaced "var myStr = $(this).text();" with "var myStr = $(this).html();" and other places in the script which called for 'text'... Granted there is no "Show Less" function but that's OK. I'm satisfied with what I have now.
Thanks again!
Edited by Grimloch on 18-12-2020 16:48,
0 replies
G
Grimloch
G
Energy can neither be created nor destroyed; only transformed !
  • Senior Member, joined since
  • Contributed 722 posts on the community forums.
  • Started 141 threads in the forums
  • Started this discussions
  • Answered 2 questions
answered
Senior Member

OK; so I was a little pre-mature guys. I do need some more help. I would like to add a "read-less" function to my existing function and have no idea how to go about it. This is my current function:
echo '<script>
$(document).ready(function(){
    var maxLength = 500;
    $(".show-read-more").each(function(){
        var myStr = $(this).html();
        if($.trim(myStr).length > maxLength){
            var newStr = myStr.substring(0, maxLength);
            var removedStr = myStr.substring(maxLength, $.trim(myStr).length);
            $(this).empty().html(newStr);
            $(this).append(\'<a href="javascript:void(0);" class="read-more"><br><div align="center"><b>...continue reading...</b></div></a>\');
            $(this).append(\'<span class="more-html">\'+removedStr+\'</span>\');
        }
    });
    $(".read-more").click(function(){
        $(this).siblings(".more-html").contents().unwrap();
        $(this).remove();
    });
});
</script>\n';

...and this is the very simple css:
.show-read-more .more-html {
        display: none;
}

...and this is the calling part:
<p class='show-read-more'>$body</p>

...I'm pretty good most of the time at modifying existing code but I have little experience with jQuery functions but I'm learning. Thanks in advance if you can help me.
0 replies
D
douwe_yntema
D
  • Senior Member, joined since
  • Contributed 667 posts on the community forums.
  • Started 57 threads in the forums
  • Answered 1 question
answered
Senior Member

I think you have to set the contents of more.html to none or set the diplay to none
0 replies
G
Grimloch
G
Energy can neither be created nor destroyed; only transformed !
  • Senior Member, joined since
  • Contributed 722 posts on the community forums.
  • Started 141 threads in the forums
  • Started this discussions
  • Answered 2 questions
answered
Senior Member

I know what you are saying but I have no idea how to implement that or where it goes...
0 replies
G
Grimloch
G
Energy can neither be created nor destroyed; only transformed !
  • Senior Member, joined since
  • Contributed 722 posts on the community forums.
  • Started 141 threads in the forums
  • Started this discussions
  • Answered 2 questions
answered
Senior Member

OK guys you can forget this one. I found another script that works well outta' the box. More/Less now achieved.
0 replies

Labels

None yet

Statistics

  • Views 0 views
  • Posts 7 posts
  • Votes 0 votes
  • Topic users 3 members

3 participants

F
F
Falk 131
Need help?, Having trouble?
• View our Documentation for Guides, Standards and Functions
• Name and Organize your Topics and Content correctly in the corresponding Forums for best support results
• Attaching Log Files and Screenshots when reporting issues will help
• Provide with an URL to live example if one exists
• Please read the How to Report an Error post
• Please read and comply with the Code of Conduct

(¯·._.·(¯°·._.·°º*[ Project Manager ]*º°·._.·°¯)·._.·¯)
  • Super Admin, joined since
  • Contributed 6,201 posts on the community forums.
  • Started 639 threads in the forums
  • Answered 11 questions
G
G
Energy can neither be created nor destroyed; only transformed !
  • Senior Member, joined since
  • Contributed 722 posts on the community forums.
  • Started 141 threads in the forums
  • Started this discussions
  • Answered 2 questions
D
D
  • Senior Member, joined since
  • Contributed 667 posts on the community forums.
  • Started 57 threads in the forums
  • Answered 1 question

Notifications

Track thread

You are not receiving notifications from this thread.

Related Questions

Not yet