How to divide a Literal into two parts

Question

I am displaying content from my database in my Literal control kept on an asp.net page.

I want to fetch all the data, but using script display only a portion to the user. A link called 'Read More..' will get dynamically added at the end of the text. If the user enjoys reading a portion, he/she can click 'Read More..' and go through the entire article.

How can I create such a functionality?

Answer 1

I suggest that you don't put a literal on the page. To start I would put a PlaceHolder on the page. Then you can shorten the display text which would be added to a Literal which would then be added to the PlaceHolder. Then you can add a HyperLink (or a LinkButton) to the PlaceHolder. When the user clicks the link/button you can reset the data for that PlaceHolder.

Answer 2

Kind of along the same lines as Andrew, but with some Javascript:

Cut the literal where you want to, and add in a Hyperlink and a span with display:none.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do  
eiusmod tempor <a href="#" id="readMore">Read More ...</a> 
<span id="readMoreText">incididunt  ut labore et dolore magna aliqua. 
Ut enim ad minim veniam, quis  nostrud exercitation ullamco laboris nisi 
ut aliquip ex ea commodo  consequat. Duis aute irure dolor in reprehenderit 
in voluptate velit  esse cillum dolore eu fugiat nulla pariatur. 
Excepteur sint occaecat  cupidatat non proident, sunt in culpa qui 
officia deserunt mollit anim id est laborum.</span>

You can kind of see it in there. In your Javascript (jQuery), when the #readMore is clicked, have #readMoreText go from display:none to display:inline, and have the hyperlink be display:none.