ParamQuery grid support forum

General Category => Help for ParamQuery Pro => Topic started by: jplevene on June 11, 2024, 06:13:09 pm

Title: Getting rid of the ellipsis in some header columns not working
Post by: jplevene on June 11, 2024, 06:13:09 pm

Setting the following colModel attributes does not work:

Code: [Select]

{dataIndx:"NOTE", dataType:"stringi", title:lang.noteTxt, halign:"center", sortable: false,
render:function(ui){ return { cls: "italictext", attr:{title:ui.rowData["NOTE"]} };}
},
{dataIndx:"IS_STOCK", dataType:"int", minWidth:25, width:25, maxWidth:25, halign:"center", sortable: false, title:'<span class="ui-icon ui-icon-gear"></span>',
attrHead: {title:lang.edit_item_kind[2], style:"text-overflow:unset"},
styleHead: {"text-overflow":"unset"},
render:function(ui){ return { text: ui.cellData>0 ? "&check;" : "" };}
},
{dataIndx:"IS_CONSUMABLE", dataType:"int", minWidth:25, width:25, maxWidth:25, halign:"center", sortable: false, title:'<span class="ui-icon ui-icon-cart-b"></span>',
attrHead: {title:lang.edit_item_kind[1]},
render:function(ui){ return { text: ui.cellData>0 ? "&check;" : "" };}
},
{dataIndx:"IS_LABOUR", dataType:"int", minWidth:25, width:25, maxWidth:25, halign:"center", sortable: false, title:'<span class="ui-icon ui-icon-person"></span>',
attrHead: {title:lang.edit_item_kind[4]},
render:function(ui){ return { text: ui.cellData>0 ? "&check;" : "" };}
}
The reason is that the ellipsis is set in a child div so setting attrHead or styleHead has no affect.  I only need to get rid of it on 3 columns out of 5.  The reason is that it shouldn't be there, but appears due to a re-sizing and the fact that I am using a jQuery icon

Title: Re: Getting rid of the ellipsis in some header columns not working
Post by: paramvir on June 11, 2024, 10:52:40 pm

I checked by adding the columns shared by you in this example:

Code: [Select]

{dataIndx:"NOTE", dataType:"stringi", title:"", halign:"center", sortable: false,
render:function(ui){ return { cls: "italictext", attr:{title:"" }}}
},
{dataIndx:"IS_STOCK", dataType:"int", minWidth:25, width:25, maxWidth:25, halign:"center", sortable: false, title:'<span class="ui-icon ui-icon-gear"></span>',
attrHead: {title:"", style:"text-overflow:unset"},
styleHead: {"text-overflow":"unset"},
render:function(ui){ return { text: ui.cellData>0 ? "&check;" : "" };}
},
{dataIndx:"IS_CONSUMABLE", dataType:"int", minWidth:25, width:25, maxWidth:25, halign:"center", sortable: false, title:'<span class="ui-icon ui-icon-cart-b"></span>',
attrHead: {title:""},
render:function(ui){ return { text: ui.cellData>0 ? "&check;" : "" };}
},
{dataIndx:"IS_LABOUR", dataType:"int", minWidth:25, width:25, maxWidth:25, halign:"center", sortable: false, title:'<span class="ui-icon ui-icon-person"></span>',
attrHead: {title:""},
render:function(ui){ return { text: ui.cellData>0 ? "&check;" : "" };}
}

https://paramquery.com/pro/demos/wrap

but unable to reproduce the ellipsis beside the icon in any of the columns. Any other changes in your code I should be aware of?

Title: Re: Getting rid of the ellipsis in some header columns not working
Post by: jplevene on June 11, 2024, 11:00:01 pm

I added the columns to the end, using Cupertino theme (JQuery) in you demo and the Ellipsis were there, albeit just one dot of them.  Make sure screen is as wide as possible.

See screen shot attached

Resizing the screen seems to make them go, but I think that is only because the columns are thinner.

Title: Re: Getting rid of the ellipsis in some header columns not working
Post by: paramvir on June 11, 2024, 11:13:15 pm

Ok, I see that. you can get rid of that by either using hwrap: true option

or adding following css rule

Code: [Select]

<style>
.pq-icon-col-sort{
display: none;
}
</style>


Title: Re: Getting rid of the ellipsis in some header columns not working
Post by: jplevene on June 11, 2024, 11:16:24 pm

I can't as some columns sort and I need that.  Also my CSS is shared across multiple pages and they use the sorting icons, etc.

It's not that major, but if you could in the next version give some way of removing ellipsis that would be great.

BTW hwrap is false not true

Title: Re: Getting rid of the ellipsis in some header columns not working
Post by: paramvir on June 12, 2024, 11:45:59 am

The suggested css solution doesn't affect the display of sorting icons in sorted columns.

Title: Re: Getting rid of the ellipsis in some header columns not working
Post by: jplevene on June 20, 2024, 07:29:08 pm

But it effects all other grids and columns, I only want 3 out of 5 columns to not have the elipsis

Title: Re: Getting rid of the ellipsis in some header columns not working
Post by: paramvir on June 21, 2024, 01:28:38 pm

Could you please share a jsfiddle how it's affecting the other columns.