Wrap Query Grid Column Header Text

If you have questions or if you want to share your opinion about Aware IM post your message on this forum
Post Reply
customaware
Posts: 2391
Joined: Mon Jul 02, 2012 12:24 am
Location: Ulaanbaatar, Mongolia

Wrap Query Grid Column Header Text

Post by customaware »

Now we have Kendo it is possible to easily allow for wrapping Column Header text in a Query grid.

Placing this in you css file works great....

.k-grid .k-grid-header .k-header .k-link {
height: auto;
}
.k-grid .k-grid-header .k-header {
white-space: normal;
}

However, say I only wanted to apply that the a single column in a single Query rather than universally across the app.
How would I do that please?
Cheers,
Mark
_________________
AwareIM 6.0, 8.7, 8.8, 9.0 , MariaDB, Windows 10, Ubuntu Linux. Theme: Default, Browser: Arc
Upcloud, Obsidian....
Image
johntalbott
Posts: 619
Joined: Wed Jun 17, 2015 11:16 pm
Location: Omaha, Nebraska
Contact:

Re: Wrap Query Grid Column Header Text

Post by johntalbott »

Assuming you want to allow wrapping in the 2nd column header only .. the quickest way is ....

Init Script

Code: Select all

config.columns[1].headerAttributes = {style: "white-space: normal"};
Last edited by johntalbott on Mon May 20, 2019 4:28 pm, edited 1 time in total.
VocalDay Solutions - Agility - Predictability - Quality

We specialize in enabling business through the innovative use of technology.

AwareIM app with beautiful UI/UX - https://screencast-o-matic.com/watch/crfUrrVeB3t
customaware
Posts: 2391
Joined: Mon Jul 02, 2012 12:24 am
Location: Ulaanbaatar, Mongolia

Re: Wrap Query Grid Column Header Text

Post by customaware »

Legend John.

You must have had a lot of previous experience in js, jquery etc stuff.

You seem to totally "get it" so very thankful for you contributions.

May have to get you thinking of doing a Workshop at the next Conference? ;-)
Cheers,
Mark
_________________
AwareIM 6.0, 8.7, 8.8, 9.0 , MariaDB, Windows 10, Ubuntu Linux. Theme: Default, Browser: Arc
Upcloud, Obsidian....
Image
BenHayat
Posts: 2749
Joined: Thu Dec 23, 2010 5:48 am
Location: Fla, USA
Contact:

Re: Wrap Query Grid Column Header Text

Post by BenHayat »

eagles9999 wrote:Legend John.

You must have had a lot of previous experience in js, jquery etc stuff.

You seem to totally "get it" so very thankful for you contributions.

May have to get you thinking of doing a Workshop at the next Conference? ;-)
I've avoided JS, jQuery, CSS & HTML and now it's hunting me... :oops:
BLOMASKY
Posts: 1470
Joined: Wed Sep 30, 2015 10:08 pm
Location: Ocala FL

Road Trip to John's House

Post by BLOMASKY »

wait! I have a new car. Road Trip to John's house and we can all learn from the expert!

Bruce
RLJB
Posts: 914
Joined: Tue Jan 05, 2010 10:16 am
Location: Sydney, Australia

Re: Wrap Query Grid Column Header Text

Post by RLJB »

To apply it to all cols in a grid in the initialisation script try:

for (var i = 1; i < config.columns.length; i++) {
config.columns.headerAttributes = {style: "white-space: normal"}
}
Rod. Aware 8.6 (latest build), Developer Edition, on OS Linux (Ubuntu) using GUI hosted on AWS EC2, MYSQL on AWS RDS
Post Reply