jqgrid convert text

Question

I'm not sure how to call this so any suggestion to change the title is welcome.

I'm trying to convert a quite large text to something like 'just show some characters...'. Obviously the large text begins with same string but it's much longer.

My grid is read-only and I'll show the whole data into a dialog when users click each row. The input field (in another page) is a text area so users can write down huge data to be show in the grid. I would like to keep each row with same height. Also I know I have to sanitize the text to avoid special characters and new lines

I guess it should be a colModel option to do that but I couldn't find it. Something like that:

colModel :[
        {name:'notes', index:'notes', maxcharlength: 20},

Many thanks.

See [the answer](http://stackoverflow.com/a/6861490/315935). You can consider to set `max-height` or rows like described [here](http://stackoverflow.com/a/6574194/315935). — Oleg, Mar 26 '13 at 17:07
the answer it's exactly what I need. Also your suggestion of max-height looks very interesting. Thanks a lot!! Also just in case, do you know if there is a simple way to strip html using jqgrid? if not I'll use jsoup on server side. Thanks again — Pedro Robles, Mar 27 '13 at 08:53
You are welcome! It's important that you decide whether you need to show *original long text* to the user or not. For example look at [another answer](http://stackoverflow.com/a/13330814/315935) and [this one](http://stackoverflow.com/a/8420646/315935) too. You can for example provide the user way to see full text, but only in View and Edit forms and display stripped data in the grid. In the case you should don't cut the data on the server side. Instead of that you should use some kind of stripping of the client side with CSS or for example custom formatter. — Oleg, Mar 27 '13 at 09:15
Thanks Oleg. But I need to strip not to encode. Dont worry I'll use jsoup, if I can ;-) — Pedro Robles, Mar 27 '13 at 09:45

score 1 · Accepted Answer · answered Mar 26 '13 at 16:55

1

You can make a CSS class that will clip the text and show ellipses and assign it to the column using the classes attribute. The CSS class would look like this:

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

Then assign it to the column like this:

colModel :[
    {name:'notes', index:'notes', maxcharlength: 20, classes: 'ellipsis'},

answered Mar 26 '13 at 16:55

clav

4,221
30
43

Thanks clav. Your answer its very similar to @Oleg's. – Pedro Robles Mar 27 '13 at 08:58
Hi Clav. Does we have maxcharlength property in jqgrid. Bcoz i tried using the ellipsis with maxcharlength, but it is not working. It is working only based on width. – PCA Feb 20 '14 at 09:26
Hi @Babu Arumugam, The option 'maxcharlength' doesnt't exist. It was my guess just in case jqGrid implemtented the ellipsis by default. Regards – Pedro Robles Mar 28 '14 at 11:52

score 0 · Answer 2 · answered Mar 27 '13 at 10:18

At the end and thanks to Oleg's links I could fill the grid stripping html and showing ellipsis in this way:

First a css:

.ui-jqgrid tr.jqgrow td.textInDiv div {
    max-height: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}

Second a custom formatter on the column:

colModel :[
    {name: 'notes', classes: "textInDiv", 
          formatter: function (v) {
               return '<div>' + jQuery.jgrid.stripHtml(v) + '</div>';
          }
     }
 ]

Notes come from server as html so please note the jqgrid function to strip html tags. In Oleg's links he uses jqgrid.htmlEncode to escape tags.

Hope this helps to others.

@Oleg I have found the stripHtml function which does exactly what I want — Pedro Robles, Mar 27 '13 at 10:42

jqgrid convert text

2 Answers2