Skip to Content
avatar image
Former Member

How can i fix a crosstab graphical issue related with CSS crosstab scripting?

Hi,

i followed this : Tutorial - Show-Hide columns in a crosstab. in my SAP Design Studio 1.6 Sp3 application.

I created 2 checkboxes group that edit a crosstab with 14 columns: one with 2 options and one with 3 options.

I succeed to create the CSS for all the options and see those changes on the crosstab but i see a graphical issue on the crosstab itself.

when i use the navigation bar to see all the columns showed (a crosstab with 5-6 columns showed and the others hided) all the columns disappeared.

Why?

When i uncheck and recheck i can see again the first 3 columns in the right way but i always need the navigation bar for the others columns.

I cannot extend the size of the crosstab.

Before use horizontal navigaton bar:

After using navigation bar:

I think is a graphical issue related to the crosstab and the CSS but i do not know how can fix it.

This is a sample of my CSS code inspired by the link above.

...
/* show measures YTDBT: 3,4 and 7 columns  hide all the others */

.showMeasure.measureYTDBT .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(1)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(2)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(5)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(6)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(8)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(9)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(10)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(11)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(12)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(13)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:nth-child(14)
,.showMeasure.measureYTDBT  .sapzencrosstab-ColumnHeaderArea td.sapzencrosstab-HeaderCellDefault:not(:nth-child(-n+14)),.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(1)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(2)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(5)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(6)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(8)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(9)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(10)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(11)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(12)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(13)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:nth-child(14)
,.showMeasure.measureYTDBT  .sapzencrosstab-DataArea td.sapzencrosstab-DataCellDefault:not(:nth-child(-n+14)){display: none;}

...

Thank you for your help

Marco

Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

3 Answers

  • avatar image
    Former Member
    Jan 16, 2017 at 11:24 AM

    Hi,

    I have installed SP4 but the error is not fixed.

    :(

    Marco

    Add comment
    10|10000 characters needed characters exceeded

  • avatar image
    Former Member
    Jan 16, 2017 at 11:52 AM

    HI,

    i tried to show only 3 columns everytime (with radio buttons) and that kind of graphical issue disappear because there is no need of horizontal bar.

    Now, if i test all the options i see always in a right way 3 columns but when i use the vertical bar the crosstab collapses in 2 columns and sometimes in no columns, There is only the dimensions!

    Any advice?

    Thanks
    Marco

    Add comment
    10|10000 characters needed characters exceeded

  • avatar image
    Former Member
    Jan 17, 2017 at 10:35 AM

    i checked also with few data in order to avoid horizontal and vertical bar and it works fines, so i think it is constraint to the bars.
    No idea how fix it?

    Thanks

    Marco


    Add comment
    10|10000 characters needed characters exceeded