Column lines not visible

[timo75Participant]

Hi,

I’m using jqxGrid with Vue.

I’m trying to make vertical column lines visible, but it seems that even though ‘showcolumnlines’ is not set to false, there is an inline-style ‘border-right-color: transparent’ which overrides the CSS class and hides the lines:

https://www.screenpresso.com/=eYqHf

Is this a bug or am I missing something?

Thanks,
Timo

[HristoParticipant]

Hello Timo,

I would like to ask you do you use additional style settings.
Could you clarify it?
I tested this demo and it seems to work fine:
https://www.jqwidgets.com/vue/vue-grid/vue-grid-defaultfunctionality.htm?light

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[timo75Participant]

Hi Hristov,

Thanks for the reply. As I mentioned: I keep getting ‘border-right-color: transparent’ rendered in the markup as an inline style. In your example it’s not there. If I deactivate the inline-style in the console, the vertical line for that cell gets displayed correctly. So I wonder why that style is getting rendered here, even if I hard set shocolumnlines to false (though ‘true’ is the default if not set).

Cheers,
Timo

[adminKeymaster]

Hi Timo,

The border-right-color is expected to be transparent. Otherwise, you will end up with double-borders. You may look at this example: https://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/grid-lines.htm?light which shows how to turn on/off row/column/header lines.

Best Regards,
Peter Stoev

jQWidgets Team
https://www.jqwidgets.com/

[timo75Participant]

Hi Peter,

Thanks for the explanation. The demo switches the showColumlines attribute on/off, which is exactly what I’m trying to do but doesnt work.

But then I guess I’ll have to analyze further what might cause the problem on my site.

Thanks,
Timo

[timo75Participant]

Hi Peter,

I had a look at your example and when I activate columnLines there, the “border-right-color: transparent” is removed from the markup. See:
https://www.screenpresso.com/=IJ8Hc

That’s why I’m a bit irritated by your statement that it needs to be there to avoid double-borders.

As I said, even if I’m force-setting showcolumlines=true (which shouldnt be necessary, I’m getting “border-right-color: transparent” in the markup…

You don’t seem to have the same example in the Vue section in your demos. Maybe you can double check it?

Cheers,
Timo

[timo75Participant]

Waht I find strange is that when I inspect the props, they are always “0”. Shouldnt that be true/false if it’s supposed to be Boolean?
https://www.screenpresso.com/=8Powg

[timo75Participant]

Peter,

FYI: I downgraded from 10.0.2 to 10.0.0, then to 9.1.6.

With 9.1.6 the columlines show up correctly, i.e.:
– In Vue Dev Tools, the prop is now correctly displayed as showcolumnlines:true instead of showcolumnlines:0 (see my previous comment)
– ‘border-right-color: transparent’ is not rendered in the markup anymore.

Looks like a bug in v10 to me. Maybe you can investigate it.

Cheers,
Timo

[adminKeymaster]

Hi Timo,

Column Lines work correctly with the current version: https://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/grid-lines.htm?light.

Best Regards,
Peter Stoev

jQWidgets Team
https://www.jqwidgets.com/

[Author]

Posts