0

Grid horizontal scroolbar doesn't work

asked 2016-06-24 16:13:03 +0800

hancock46 gravatar image hancock46
13 3

Hi,

I have a grid with many columns. So I want to view all columns with the size of their values with a horizontal scrollbar associated to the grid.

<grid vflex="min" mold="paging" autopaging="true" >
    <columns  menupopup="auto"  >
        <column label="C0" width="30px"  />
        <column label="C1"   width="150px" />
        <column label="C2"   width="150px" />
        <column label="C3"   width="150px" />
        <column label="C4"   width="150px" />
        <column label="C5"   width="150px" />
        <column label="C6"   width="150px" />
        <column label="C7"   width="150px" />
        <column label="C8"   width="150px" />
        <column label="C9"   width="150px" />
        <column label="C10"  width="150px" />
        <column label="C11"  width="150px" />
        <column label="C12"  width="150px" />
        <column label="C13"  width="150px" />
        <column label="C14"  width="150px" />
        <column label="C15"  width="150px" />
        <column label="C16"  width="150px" />
        <column label="C17"  width="150px" />
        <column label="C18"  width="150px" />
        <column label="C19"  width="150px" />
        <column label="C20"  width="150px" />
        <column label="C21"  width="150px" />
    </columns>
    <rows>
        <row>
            <image src="http://www.xmlmind.com/xmleditor/_tutorial/copy_paste/image/delete.png" />
            <label value="dsa 02" width="100%" />
            <label value="37971375" width="100%" />
            <label value="qs" width="100%" />
            <label value="24/07/2016" width="100%" />
            <label value="s" width="100%" />
            <label value="U0I5049" width="100%" />
            <label value="Pending" width="100%" />
            <label value="ewqewq" width="100%" />
            <label value="013" width="100%" />
            <label value="IRD" width="100%" />
            <label value="IRS" width="100%" />
            <label value="*" width="100%" />
            <label value="QV4Q8OGJ7OA6PA8SCM14" width="100%" />
            <label value="dasdasdsa" width="100%" />
            <label value="16/06/2014" width="100%" />
            <label value="LIVE" width="100%" />
            <label value="0" width="100%" />
            <label value="01/01/1900" width="100%" />
            <label value="0" width="100%" />
            <label value="0" width="100%" />
            <label value="53255423redfds" width="100%" />
        </row>                  
        <row>
            <image />
            <label value="dsadsa 03" width="100%" />
            <label value="2616101" width="100%" />
            <label value="7" width="100%" />
            <label value="20/07/2016" width="100%" />
            <label value="21/07/2016" width="100%" />
            <label value="ssss" width="100%" />
            <label value="OK" width="100%" />
            <label value="dsadsadas SRL" width="100%" />
            <label value="dsad" width="100%" />
            <label value="dadasd" width="100%" />
            <label value="cxzcxz" width="100%" />
            <label value="nbvnv" width="100%" />
            <label value="81560051E53C84BD9695" width="100%" />
            <label value="fhdsyghuyugysdzuvb" width="100%" />
            <label value="20/05/2014" width="100%" />
            <label value="dsadadsa" width="100%" />
            <label value="1" width="100%" />
            <label value="03/06/2014" width="100%" />
            <label value="0" width="100%" />
            <label value="-1" width="100%" />
            <label value="nuvfyhnuhvfhd nbsugunbfdhns" width="100%" />
        </row>                  
    </rows>
</grid>

I tryied in many way, but I don't solve the problem. Can you help me please?

delete flag offensive retag edit

3 Answers

Sort by ยป oldest newest most voted
0

answered 2016-06-26 10:22:58 +0800

Darksu gravatar image Darksu
1991 1 4

Hello hancock46,

You should set style="overflow: auto"

Best Regards,

Darksu

link publish delete flag offensive edit

Comments

Hi Darksu, I tryied with this option, but I get two horizontal scrollbars and a vertical scrollbar. I need only one horizontal scrollbar associated to the grid. Do you have some ideas?

hancock46 ( 2016-06-26 11:31:00 +0800 )edit

overflow-x:auto

chillworld ( 2016-06-27 05:19:38 +0800 )edit
0

answered 2016-06-27 06:38:44 +0800

Darksu gravatar image Darksu
1991 1 4

Hello hancock46,

If you want only to show the horizontal scrollbar then use the following code:

<grid  mold="paging" autopaging="true"  style="overflow-x: auto;">
    <columns  menupopup="auto"  >
        <column label="C0" width="30px"  />
        <column label="C1"   width="150px" />
        <column label="C2"   width="150px" />
        <column label="C3"   width="150px" />
        <column label="C4"   width="150px" />
        <column label="C5"   width="150px" />
        <column label="C6"   width="150px" />
        <column label="C7"   width="150px" />
        <column label="C8"   width="150px" />
        <column label="C9"   width="150px" />
        <column label="C10"  width="150px" />
        <column label="C11"  width="150px" />
        <column label="C12"  width="150px" />
        <column label="C13"  width="150px" />
        <column label="C14"  width="150px" />
        <column label="C15"  width="150px" />
        <column label="C16"  width="150px" />
        <column label="C17"  width="150px" />
        <column label="C18"  width="150px" />
        <column label="C19"  width="150px" />
        <column label="C20"  width="150px" />
        <column label="C21"  width="150px" />
    </columns>
    <rows>
        <row>
            <image src="http://www.xmlmind.com/xmleditor/_tutorial/copy_paste/image/delete.png" />
            <label value="dsa 02" width="100%" />
            <label value="37971375" width="100%" />
            <label value="qs" width="100%" />
            <label value="24/07/2016" width="100%" />
            <label value="s" width="100%" />
            <label value="U0I5049" width="100%" />
            <label value="Pending" width="100%" />
            <label value="ewqewq" width="100%" />
            <label value="013" width="100%" />
            <label value="IRD" width="100%" />
            <label value="IRS" width="100%" />
            <label value="*" width="100%" />
            <label value="QV4Q8OGJ7OA6PA8SCM14" width="100%" />
            <label value="dasdasdsa" width="100%" />
            <label value="16/06/2014" width="100%" />
            <label value="LIVE" width="100%" />
            <label value="0" width="100%" />
            <label value="01/01/1900" width="100%" />
            <label value="0" width="100%" />
            <label value="0" width="100%" />
            <label value="53255423redfds" width="100%" />
        </row>                  
        <row>
            <image />
            <label value="dsadsa 03" width="100%" />
            <label value="2616101" width="100%" />
            <label value="7" width="100%" />
            <label value="20/07/2016" width="100%" />
            <label value="21/07/2016" width="100%" />
            <label value="ssss" width="100%" />
            <label value="OK" width="100%" />
            <label value="dsadsadas SRL" width="100%" />
            <label value="dsad" width="100%" />
            <label value="dadasd" width="100%" />
            <label value="cxzcxz" width="100%" />
            <label value="nbvnv" width="100%" />
            <label value="81560051E53C84BD9695" width="100%" />
            <label value="fhdsyghuyugysdzuvb" width="100%" />
            <label value="20/05/2014" width="100%" />
            <label value="dsadadsa" width="100%" />
            <label value="1" width="100%" />
            <label value="03/06/2014" width="100%" />
            <label value="0" width="100%" />
            <label value="-1" width="100%" />
            <label value="nuvfyhnuhvfhd nbsugunbfdhns" width="100%" />
        </row>                  
    </rows>
</grid>

I tested it, and only one horizontal bars appear. So maybe you have a second component that shows a horizontal bar.

Hope it helps!

Best Regards,

Darksu

link publish delete flag offensive edit
0

answered 2016-06-27 07:22:17 +0800

hancock46 gravatar image hancock46
13 3

Hi Darksy, I tried your solution, and now it works but in your example you deleterd vflex attribute. With vflex attribute the horizontal scrollbar is not visible. However thank you for your suggestion. Now I will try to delete vflex attribute in my project.

Thanks

link publish delete flag offensive edit

Comments

Correct as shown above in the example, the vflex has to be removed...

Darksu ( 2016-06-27 07:52:46 +0800 )edit

Ok, in this way this works. But if I insert this grid in a vbox I lose again the scrollbar. For example

<vbox> <grid mold="paging" autopaging="true" style="overflow-x: auto;"> ...... </grid > </vbox>

Do you know the reason?

hancock46 ( 2016-06-27 12:26:27 +0800 )edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
1 follower

RSS

Stats

Asked: 2016-06-24 16:13:03 +0800

Seen: 26 times

Last updated: Jun 27 '16

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More