Express.js to EJS rendering data partially

Question

Imagine the Database like below.

// 'Article'  Schema
{ 
subject : 'Hello world', 
content : 'I want to display this content partially. 
           The content would has verbose text like long
           blabla...........blabla.......blabla......blabla...........
           blabla.......blabla......blabla...........b........
           and even more, It would has <img src=".......jpg"/>
}

Now I render this data to some ejs file,

<table>
<% Articles.forEach(function(article, index){ %>
    <tr>
       <td> <%= article.subject %> </td>
       <td> <%= article.content %> </td>
    </tr>
<% }) %>
</table>


// To don't display verbosely, give style attribute (Of course, on top of html)

<style>
     td { white-space: nowrap; overflow: hidden; }
</style>

But this way, It maybe decrease application performance, right? If there are 10, 20, 30 articles on one page, The server will try to display whole of this things. What I want to make is some summary of contents, How can I do this cleverly?

RIYAJ KHAN · Accepted Answer · 2016-03-20 12:17:45Z

2

For summery contents,display initial few text with ellipses in the end

<table>
<% Articles.forEach(function(article, index){ %>
    <tr>
       <td> <%= article.subject %> </td>
       <td> <%= article.content.substring(0,10) %> ...</td>
       <td> <a id="read_more" content_id="cont-id" href = "javascript:(void)"> read more..</a></td>
    </tr>
<% }) %>

Then use ajax application to get complete data on click of read more depend whether are you using jquery or angular etc.

And if there are more article then do pagination with ajax application or page refresh

On node side create API which gives this content data or new articles in the same format that you did during page load

edited Mar 20, 2016 at 12:17

answered Mar 20, 2016 at 11:29

RIYAJ KHAN

15.3k5 gold badges34 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ton1 Over a year ago

Thanks ! It's easy and understandable.

Collectives™ on Stack Overflow

Express.js to EJS rendering data partially

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related