javascript using the original string instead of the substring

Question

I'm not sure how informative the title is but here is what I am doing...

I have a vertical menu on the left of my page which has smallish paragraphs set out in a list and I am using javascript's substring method to truncate the number of words and replace them with three dots, call it 'ellipsing' or whatever you may.

However is there any way to keep that view but also make it so that when I click on one of the paragraphs it uses the entire/original string that was there? because so far it only retrieves the truncated string.

Further to add the so called paragraphs are actually text that are pulled out from a database and put in the div tag...using asp here.

Sure, there's a way to do that. Keep the original string somewhere and add a click handler that shows the original string. Not sure what kind of help you really expect here. — Dave Newton
– Dave Newton, Commented Dec 12, 2013 at 14:35
I suggest using the css ellipsing and toggle it using a class when you clic on one of the elements — Jonas Grumann
– Jonas Grumann, Commented Dec 12, 2013 at 14:36
Would help if you posted some code as an example of what you have already. — Neil Neyman
– Neil Neyman, Commented Dec 12, 2013 at 14:37

Abhitalks · Accepted Answer · 2013-12-12 14:47:16Z

1

Create a css class like this:

.ellip {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

Apply this class to your menu items (paragraphs as you call them). The parent of those menu-items should have a width.

See this fiddle: http://jsfiddle.net/88mmf/

This will help you understand how to use javascript or jQuery to toggle this class on click.

Hope that helps.

edited Dec 12, 2013 at 14:47

answered Dec 12, 2013 at 14:38

Abhitalks

28.5k6 gold badges61 silver badges82 bronze badges

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

3 Comments

user2405469 Over a year ago

interesting, when I had tried white-space no wrap before with text-overflow hidden, it didn't work as well because I didn't use overflow:hidden.. thank you, it has done the trick

Abhitalks Over a year ago

@user2405469: Glad to help. I have updated the answer to include a fiddle to help you understand better.

user2405469 Over a year ago

thank you, I just implmented the overflow:hidden, done too much with jquery, it is nice to not have included more with the number of things I have in there already.

Samuel · Accepted Answer · 2013-12-12 14:44:27Z

0

You can keep the whole strings in a global array (window.labels), and reference them either in the truncated version or the full text version:

window.labels = [];
window.labels[0] = 'very long string bla bla bla';
window.labels[1] = ...

answered Dec 12, 2013 at 14:44

Samuel

2,1561 gold badge18 silver badges28 bronze badges

1 Comment

user2405469 Over a year ago

now this was the original idea in my head that I just didn't want to go to. I was thinking have the originals stored in some array, get the content of what was clicked and find it in the array and then get that content instead, thinking too much like a programmer, love it.

Collectives™ on Stack Overflow

javascript using the original string instead of the substring

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related