1. #1
    Ext User
    Join Date
    Jun 2008
    Posts
    6
    Vote Rating
    0
    michik is on a distinguished road

      0  

    Default [FIXED] Problem with alignment of table content

    [FIXED] Problem with alignment of table content


    Hi,

    We are evaluating GWT to use it for programming rich-client web-applications.
    Therefore we use your Ext GWT in Version gxt-1.0-beta4 (also evaluation and
    for further use to BUY).

    But we have some troubles with some widgets (special with IE6 SP2):
    - We're using your "com.extjs.gxt.ui.client.widget.table.Table" and it looks
    like, there is a bug with the layout. If the column header is longer than the
    column data, the layout is not correctly aligned (column data is not at the
    same alignement as the column header).

    - Sometimes we received the following error showing some data on the table:
    com.google.gwt.core.client.JavaScriptException: (TypeError): 'sd' is null or no
    object number: -2146823281 description: 'sd' is null or no object


    Greetings
    Michi

  2. #2
    Sencha - GXT Dev Team darrellmeyer's Avatar
    Join Date
    May 2007
    Location
    Washington, DC
    Posts
    2,242
    Vote Rating
    2
    darrellmeyer is on a distinguished road

      0  

    Default


    First, download the beta4 again as there were some issues with the package. If you still have problems, then please post some sample code that shows the issues you are having. Also, a table must be sized in order to render properly, this can happen directly or by the table's containing container.

  3. #3
    Ext User
    Join Date
    May 2008
    Posts
    19
    Vote Rating
    0
    slupix is on a distinguished road

      0  

    Default


    I downloaded the beta4 today and compile with the gwt 1.5 rc1, and I'm having the same problem. I tryed to set the size of the container ContentPanel but doesn't help. The cells are not aligned to the column headers.

    Besides there's a weird behaviour, each time i try to resize a column the table grows vertically (the rows are the same with same height but the horizontal scrollbar at the bottom keeps going further down).

    What am I missing???

    Here's the code snippet with the table:

    protected void initialize() {
    risorsePanelM = new ContentPanel();
    List<TableColumn> columns = new ArrayList<TableColumn>();

    TableColumn col = new TableColumn(RisorsaModel.COLUMN_COGNOMENOME, "Cognome e Nome", 150);
    columns.add(col);

    TableColumn distretto = new TableColumn(RisorsaModel.COLUMN_DISTRETTO, "Distretto", 50);
    distretto.setMinWidth(50);
    distretto.setMaxWidth(50);
    distretto.setAlignment(HorizontalAlignment.RIGHT);
    columns.add(distretto);

    TableColumn zona = new TableColumn(RisorsaModel.COLUMN_ZONA, "Zona", 40);
    zona.setMinWidth(40);
    zona.setMaxWidth(40);
    zona.setAlignment(HorizontalAlignment.RIGHT);
    columns.add(zona);

    TableColumn day = new TableColumn(RisorsaModel.COLUMN_DAY1, "25/05/2008", 80);
    columns.add(day);

    day = new TableColumn(RisorsaModel.COLUMN_DAY2, "26/05/2008", 80);
    columns.add(day);

    day = new TableColumn(RisorsaModel.COLUMN_DAY3, "27/05/2008", 80);
    columns.add(day);

    day = new TableColumn(RisorsaModel.COLUMN_DAY4, "28/05/2008", 80);
    columns.add(day);

    day = new TableColumn(RisorsaModel.COLUMN_DAY5, "29/05/2008", 80);
    columns.add(day);

    day = new TableColumn(RisorsaModel.COLUMN_DAY6, "30/05/2008", 80);
    columns.add(day);

    day = new TableColumn(RisorsaModel.COLUMN_DAY7, "01/06/2008", 80);
    columns.add(day);

    TableColumnModel tcm = new TableColumnModel(columns);

    tableM = new Table(tcm);
    tableM.setAutoWidth(true);
    tableM.setHorizontalScroll(false);
    tableM.setSelectionModel(new RowSelectionModel(SelectionMode.SINGLE));
    tableM.setVerticalLines(true);
    risorsePanelM.setHeaderVisible(false);

    ToolBar risorseToolbar = new ToolBar();
    risorseToolbar.add(new TextToolItem("Edit", "icon-edit"));
    risorsePanelM.setTopComponent(risorseToolbar);

    ListStore<RisorsaModel> store = new ListStore<RisorsaModel>();
    store.add(new RisorsaModel(12,"Bourne", "Jason", 4, 1));
    store.add(new RisorsaModel(15,"Webb", "David", 4, 1));
    TableBinder<RisorsaModel> binder = new TableBinder<RisorsaModel>(tableM, store);
    binder.init();
    risorsePanelM.add(tableM);
    risorsePanelM.setSize(700, 450);
    }

  4. #4
    Ext User
    Join Date
    May 2008
    Posts
    19
    Vote Rating
    0
    slupix is on a distinguished road

      0  

    Default Columns misalignment

    Columns misalignment


    Please help, what's wrong with the table? The data in the columns are not aligned with the column headers.

    I tryed to size the ContentPanel but nothing happens. I also tryed to fiddle with setMinWidth and setMaxWidth for each column but still doesn't solve the problem.

    Also setVerticalLines(true) seems to have no effect, as you can see.

    My application is heavily based on tables...

    I'm using beta4 against gwt 1.5 rc1.

  5. #5
    Sencha - GXT Dev Team darrellmeyer's Avatar
    Join Date
    May 2007
    Location
    Washington, DC
    Posts
    2,242
    Vote Rating
    2
    darrellmeyer is on a distinguished road

      0  

    Default


    In the future, please post your code using these guidelines.

    After a quick scan, it looks like you have not assigned a layout to the content panel and therefore, the table's ui is never calculated.

    Try adding this line:

    Code:
    risorsePanelM.setLayout(new FitLayout());

  6. #6
    Ext User
    Join Date
    May 2008
    Posts
    19
    Vote Rating
    0
    slupix is on a distinguished road

      0  

    Default


    Hi Darrel,
    I did set the layout after posting the code. I tryed to follow the code in the Explorer example and I saw the missing layout. After adding it nothing changes. The columns are still not aligned with their headers.

    Sorry for not posting the code correctly, but your link to the guidelines points to this thread, not to the guidelines, which I searched but couldn't find. If you could post it again I will have a look at them.


    I tryed to size the content panel, the table itself, the columns, still nothing. I also tryed to remove the toolbar (top component).

    Also I don't understand why tableM.setVerticalLines(true) doesn't work.

  7. #7
    Ext GWT Premium Member gslender's Avatar
    Join Date
    Mar 2008
    Location
    Brisbane, Australia
    Posts
    1,572
    Vote Rating
    3
    gslender is on a distinguished road

      0  

  8. #8
    Ext User
    Join Date
    May 2008
    Posts
    19
    Vote Rating
    0
    slupix is on a distinguished road

      0  

    Default


    I found what's causing the misalignment !
    It's the instruction

    setVerticalLines(true);

    Once I removed it the column values are correctly aligned i.e. are rendered inside the column. That istruction causes misalignment and it doesn't show the vertical lines.

    There is also another issue: is there a way to set the alignment of the label in the column header? I want them to be centered, like the values in the column but can't find anything in the api.

    I am using GXT beta 5 with GWT 1.5rc1, java 1.5 Firefox and Explorer.

  9. #9
    Ext User
    Join Date
    Jun 2008
    Posts
    6
    Vote Rating
    0
    michik is on a distinguished road

      0  

    Default


    thank you slupix for your tip. it works also for the ie6 sp2.
    only for the last columns the problem still exists, when resizing.

  10. #10
    Sencha - GXT Dev Team darrellmeyer's Avatar
    Join Date
    May 2007
    Location
    Washington, DC
    Posts
    2,242
    Vote Rating
    2
    darrellmeyer is on a distinguished road

      0  

    Default


    I found what's causing the misalignment !
    It's the instruction

    setVerticalLines(true);
    Fixed.

    There is also another issue: is there a way to set the alignment of the label in the column header? I want them to be centered, like the values in the column but can't find anything in the api.
    Fixed.

    Fixes are in SVN.