rich: extendedDataTable в rich: панель сжата - PullRequest
0 голосов
/ 03 апреля 2012

Я пытаюсь использовать extendedDataTable внутри панели.Я использую следующий код:

<?xml version="1.0" encoding="ISO-8859-1" ?>
<ui:composition 
    xmlns:jsp="http://java.sun.com/JSP/Page" 
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:rich="http://richfaces.org/rich"
    xmlns:ui="http://java.sun.com/jsf/facelets">

    <f:view>
        <h:head></h:head>
        <h:body>
            <h:form id="form">
                <rich:panel style="width:400px">
                    <rich:extendedDataTable 
                          value="#{mitarbeiterBean.mitarbeiter}"
                          var="mitarbeiter"
                          style="width: 100%;">
                        <rich:column sortBy="#{mitarbeiter.vorname}">
                            <f:facet name="header">
                                <h:outputText value="Vorname" />
                            </f:facet>
                            <h:outputText value="#{mitarbeiter.vorname}" />
                        </rich:column>

                        <rich:column sortBy="#{mitarbeiter.nachname}">
                            <f:facet name="header">
                                <h:outputText value="Nachname" />
                            </f:facet>
                            <h:outputText value="#{mitarbeiter.nachname}" />
                        </rich:column>
                    </rich:extendedDataTable>
                </rich:panel>
            </h:form>
        </h:body>
    </f:view>
</ui:composition>

Базовый компонент:

import javax.inject.Named;

@Named
public class MitarbeiterBean {
    public class Mitarbeiter {
        private String vorname;
        private String nachname;

        public Mitarbeiter (String vorname, String nachname) {
            this.vorname= vorname;
            this.nachname= nachname;
        }

        public String getVorname () {
            return vorname;
        }

        public void setVorname (String vorname) {
            this.vorname= vorname;
        }

        public String getNachname () {
            return nachname;
        }

        public void setNachname (String nachname) {
            this.nachname= nachname;
        }
    }

    public Mitarbeiter[] getMitarbeiter () {
        return new Mitarbeiter[] {
            new Mitarbeiter("Hans", "Müller"),
            new Mitarbeiter("Heiri", "Meier"),
            new Mitarbeiter("Max", "Mustermann"),
            new Mitarbeiter("Susi", "Sorgenlos")
        };
    }
}

Таблица не использует свое пространство и сжимается влево.Я почти получаю то, что хочу, с помощью следующего CSS:

.rf-edt-tbl {
    width: 100%;
}

.rf-edt-tbl tr td {
    width: 50%;
}

.rf-edt-tbl tr td div {
    width: auto;
}

Но когда появляется полоса прокрутки, заголовки и содержимое таблицы теряют выравнивание.

Как сделать так, чтобы моя таблица выгляделаправо?

Ответы [ 2 ]

0 голосов
/ 31 мая 2012

У меня такая же проблема, я предоставлю дополнительную информацию, если она даст некоторую подсказку:

Каждая ячейка имеет этот дополнительный класс (может иметь отношение к изменению размера столбца):

.rf-edt-c-j_idt162 {
  width: 100px;
}

Числа после j_idt меняются для каждого столбца. Этот класс фиксирует ширину столбца, сжимая столбцы.

Он переопределяет .rf-edt-c и .rf-edt-hdr-c, поэтому я не могу установить конкретную ширину, используя их.

<div class="rf-edt-c rf-edt-c-j_idt162"...

Если я установлю ширину столбца примерно так:

.rf-edt TABLE {
   width:100;
}
.rf-edt DIV {
   width: 100%;
}

Затем столбцы расширяются, чтобы заполнить область, но заголовок и содержимое не совпадают, поскольку заголовок и содержимое находятся в разных таблицах.

0 голосов
/ 13 апреля 2012

Используйте этот стиль в теге rich: extendedDataTable

style="table-layout:fixed;"
...