1

I have a strange question ! I made a simple create/delete notes form and a script to query them all.But it will not be beautiful if someone inserts a 100KM note and the table shows it all.

I please you to suggest me a script that shows only some content of the row, and the rest when you press something like "view all". For example :

enter image description here

1
  • Check out my answer. hope to help Jan 6, 2013 at 18:32

2 Answers 2

1

You need to look into truncating the content string, there's a load of answers available here for both JavaScript and PHP based solutions:

JavaScript: smart way to shorten long strings with javascript
PHP: Shorten string with a "..." body

So you show the truncated string to begin with and then on the full view use the original string.

Depending on how your table in the example is setup you could also try using CSS to truncate and have it add the elipses as well.

CSS: http://css-tricks.com/snippets/css/truncate-string-with-ellipsis/

1
  • Ok..it works fine with css..Thanks and sorry but I didn't know what to write in serach bar :D
    – Ion Farima
    Jan 6, 2013 at 18:29
1

Well, I think you want something like this:
Live jsfiddle

js

$(function()
{
    var maxShow = 50;
   $( ".holder" ).each(function() 
   {
       var txt = $(this).text();
       txt = txt.substr(0,maxShow)+' ...';
       $(this).prev().prev().text(txt);
   });
  $(".show").click(function()
  {
      var txt = $(this).next('span').text();
      $(this).parent().text(txt);
  });
});

html

<div class='txt'><span class='summery'></span><a href="#" class="show">view</a><span class='holder'> 0 I have a strange question ! I made a simple create/delete notes form and a script to query them all.But it will not be beautiful if someone inserts a 100KM note and the table shows it</span></div>
<div class='txt'><span class='summery'></span><a href="#" class="show">view</a><span class='holder'> 1 I have a strange question ! I made a simple create/delete notes form and a script to query them all.But it will not be beautiful if someone inserts a 100KM note and the table shows it</span></div>
<div class='txt'><span class='summery'></span><a href="#" class="show">view</a><span class='holder'> 2 I have a strange question ! I made a simple create/delete notes form and a script to query them all.But it will not be beautiful if someone inserts a 100KM note and the table shows it</span></div>

css

.holder
{
  display:none;
}
1
  • 1
    Yes ! Something like this but I'd rather use the CSS ;) Thanks
    – Ion Farima
    Jan 6, 2013 at 18:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.