Укажите ширину столбца h: panelGrid

Ранее использовалось <table> теги в формах JSF. Я замечаю, что вместо этого лучше использовать тег panelGrid, поскольку он проще в использовании и проще.Укажите ширину столбца h: panelGrid

Раньше я использовал дополнительный <td> для ярлыка <h:message > и дал ему ширину 300, чтобы предотвратить перемещение формы влево при появлении сообщений.

Теперь, я использую атрибут width тега <h:panelGrid>, но это не мое желание.

Когда появляется какое-либо сообщение об ошибке, вся форма перемещается влево, а затем появляются сообщения перед каждым input text.

Я использовал width атрибут message, но это не сработало хорошо.

Должен ли я использовать для использования <table> вместо <h:panedGrid>?

<?xml version='1.0' encoding='UTF-8' ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" 
     xmlns:h="http://xmlns.jcp.org/jsf/html" 
     xmlns:f="http://xmlns.jcp.org/jsf/core"> 
    <h:head> 
     <title>Facelet gg</title> 
    </h:head> 
    <h:body> 
     <center> 
      <h:form> 
       <h:panelGrid columns="3" width="400"> 
        <h:outputLabel value="Username:"/> 
        <h:inputText id="username" value="#{loginBean.username}" required="true"> 
         <f:validateLength maximum="30" minimum="3"/> 
        </h:inputText> 
        <h:message for="username" /> 
        <h:commandButton value="submit" action="home"/> 
       </h:panelGrid> 
      </h:form> 
     </center> 
    </h:body> 
</html>

источник

2015-02-21 Anonymous

Тег '

' был устарел давным-давно. Настаивайте на использовании CSS вместо «margin: 0 auto;», 'margin-left: auto;', 'margin-right: auto;'. – Tiny

@Tiny Я создаю эти настройки в файле css с именем '.makeCenter' и добавил его атрибутом class в тег' form' следующим образом: '', но не работал! –

'.makeCenter { margin: 0 auto; margin-left: auto; margin-right: auto; } ' –

Это нормальное поведение, потому что атрибут h:panelGridwidth для всей таблицы, а не для конкретного столбца, вы можете проверить, что в это java docs.

Однако, вы можете указать width для каждого столбца путем определения классов CSS для столбцов с помощью атрибута columnClasses:

Разделенный запятыми список классов стилей CSS, которые будут применяться к столбцов этой таблицы , Список разделенных пробелами классов также может быть , указанный для любого отдельного столбца. Если количество элементов в этом списке меньше числа фактических дочерних элементов столбца UIData, то не выводит атрибут класса для каждого столбца, большего чем число элементов в списке. Если число элементов в списке составляет больше, чем число фактических дочерних элементов столбца UIData, элементы в posisiton в списке после последнего столбца равны .

Таким образом, в вашем примере, при условии, что у вас есть style.css файл в css библиотеке, вы можете добавить что-то вроде этого к нему:

.firstColumn { 
     width: 100px; 
    } 
    .secondColumn { 
     width: 100px; 
    } 
    .thirdColumn { 
     width: 300px; 
    }

После включения файла CSS с помощью:

<h:outputStylesheet library="css" name="styles.css"/>

вы можете использовать его в h:panelGrid как следующее:

<h:panelGrid columns="3" columnClasses="firstColumn,secondColumn,thirdColumn "> 
    <h:outputLabel value="Username:"/> 
    <h:inputText id="username" value="#{loginBean.username}" required="true"> 
      <f:validateLength maximum="30" minimum="3"/> 
    </h:inputText> 
    <h:message for="username" /> 
    <h:commandButton value="submit" action="home"/> 
</h:panelGrid>

источник

2015-02-21 17:56:44 Tarik

Спасибо большое ... –

@SajjadHTLO приветствую :) – Tarik

Укажите ширину столбца h: panelGrid

ответ

Смежные вопросы