[REACT-154] Follow up custom render ticket

Tags: #<Tag:0x00007f0b0e8e9ca0> #<Tag:0x00007f0b0e8e9b60>

This is a follow up from a posting I did back in January in regards to an issue with the 1st column of custom renderer losing text when scrolling. I didn’t see a way to re-open up a ticket, but here is the link.

" Column Render issue when using FixedColumns and custom Renderer"

It appears this issue is still open, so I was wondering if the developers had a potential work-around for this? I really need a way to not have text wrap in the 1st column celll and I do this with a custom renderer, but it’s losing text when I scroll.

Or, is there another way to set the display of a field to use a DIV that doesn’t wrap text?

A follow up on this request. it may be I don’t need a custom renderer for what I’m trying to do.

I just found a setting called wordWrap, which I can set on the table. This does the first part of what I need, which is it doesn’t auto-expand the cell height based on content…it just displays what’s visible in the cell, and I can widen column to see more.

The second part of this, where I need help , is if I change the row height, I’d like the text to wrap to fill the space, but not expand./change the height. Basically, I’d want to set overflow for the cell to “hidden”, but keep wordwrap active. So, if space is available, it will wrap to fill height of cell.

Is there another setting I might be missing? Basically a way to set overflow of a cell to “hidden” ??

Hi @mhennessy7

I prepared a demo for a starting point to discuss - http://jsfiddle.net/qopur6k4/11/

If you change a column width word wrapping.
If you next try to change a row height you want to text wrapping too.

Do I understand your issue correctly?

No, what I want is no word wrapping by default…as you make cell wider, you see more, but it does not wrap / change the row height.

If I then manually change the row height, it will just wrap to contents to what fits in width/height of cell, but it will not continue to extend row height to fit content.

Basically, the cell width/height should not be changed based on content, content should fit as best it can in given cell dimensions.

This behaviour is the default for hot-table (and the table in general).

So to achieve what you want CSS alone isn’t enough.
You have to use custom renderer. Plus custom editor, I suppose.

So, this is where I started…if you look at top of ticket that I posted back in january.
I created a custom renderer (I am using React and am using holcolumn

The bug is, if this column is “frozen”, when you scroll, the text disappears. It only happens for frozen columns, but I am now looking for an alternative. Is there a potential fix coming for this?

Is there a cell CSS setting to set overflow:hidden?
One idea I had was to use the wordWrap: false for initial table load…so no text wraps. But when they click to make cell height bigger, I can flip this setting to True, which would wrap text, but then it continues to expand cell height beyond what they set.

I would think there could be a css overflow setting I could update dynamically?

We have an issue on that - https://github.com/handsontable/react-handsontable/issues/154

The main reason for this bug is that we use an additional layer (overlay) for each of the fixed areas.
And I think hot-column isn’t well cooperating with this overlays. So CSS will not help.

I can’t tell you when we will take care of this because our React developer is engaging to create a completely new formula plugin that will be based on the HyperFormula engine.

Ok, understood. What I was wondering is if I removed the custom renderer, and just used standard cell…would CSS help here? I’m only using a custom renderer to get the desired effect I’m looking for.

Is there a way to do this with CSS / standard field attributes?

If I good understand your requirements I think it isn’t possible to achieve it by CSS alone.

Maybe this type of demo - http://jsfiddle.net/v8zx5eLd/ - will give you a clue how to reach a goal.

Ok, that’s what I wanted confirmed. It can’t be done with CSS alone, which means it requires a custom renderer. However, in my case, using React Wrapper and the HotColumn, the custom renderer doesn’t work in the specific situation where column is frozen.

I guess I’m at a dead-end until your react developer comes up with a new version/fix. Is there any general ETA for that? next 3 months? next 6? next year? You mentioned he was working on a new implementation.

Yes, he’s working on a new implementation new formula plugin based on the HyperFormula engine.

It’s hard to say when he will return to React wrapper.

Hi Piotr, I wanted to see if there was any progress on this bug? As a reminder, it’s an issue to use react wrapper and have custom renderer in any frozen columns…when you vertically scroll, the content disappers. I’m hoping there is a fix soon?

Hi @mhennessy7

we do not have any updates yet but will surely update you once we make a first commit.