2016-10-02 56 views
0

我遇到了一個問題。它是我想放置一個multiSelectListbox底部的表(不是dataTable)。但是,當我這樣做時, multiSelectListbox顯示在表的頂部。爲什麼在表格的tr不能有序顯示

下面是我的代碼:

<table id="addBookTable" class="common_tab" style="width: 100%;"> 
    <tr> 
     <th><span style="color: red;">*</span>BookName:</th> 
     <td><p:inputText styleClass="inputTextClass" id="input_text_1" 
       placeholder="Input book name" value="#{bookView.newBook.name}" 
       onblur="onLeave(this)"> 
      </p:inputText></td> 
     <td> 
      <h:outputLabel styleClass="errorTipClass" value="book name must be not empty" 
      id="errorTip1" binding="#{errorTip1}"/> 
     </td> 
     <th><span style="color: red;">*</span>ISBN:</th> 
     <td><p:inputText styleClass="inputTextClass" id="input_text_2" 
       onkeypress="return (/[\d.]/.test(String.fromCharCode(event.keyCode)))" 
       placeholder="Input book's ISBN" maxlength="13" value="#{bookView.newBook.isbn}" 
       onblur="onLeave(this)"> 
      </p:inputText></td> 
     <td><p:outputLabel styleClass="errorTipClass" value="Must be thirteen bits number" 
     id="errorTip2" binding="#{errorTip2}" /></td> 
    </tr> 
    <tr> 
     <th><span style="color: red;">*</span>author:</th> 
     <td><p:inputText styleClass="inputTextClass" id="input_text_3" 
       placeholder="Input book's author" value="#{bookView.newBook.author}" 
       onblur="onLeave(this)"/></td> 
     <td><p:outputLabel styleClass="errorTipClass" value="author must be not empty" 
     id="errorTip3" binding="#{errorTip3}" /></td> 
     <th><span style="color: red;">*</span>press:</th> 
     <td><p:inputText styleClass="inputTextClass" id="input_text_4" 
       placeholder="Input book's press" value="#{bookView.newBook.press}" 
       onblur="onLeave(this)"/></td> 
     <td><p:outputLabel styleClass="errorTipClass" value="press must be not empty" 
     id="errorTip4" binding="#{errorTip4}" /></td> 
    </tr> 
    <tr> 
     <th><span style="color: red;">*</span>price:</th> 
     <td><p:inputText styleClass="inputTextClass" id="input_text_5" 
       style="text-align:right;" placeholder="Input book's price" 
       value="#{bookView.newBook.price}" onblur="onLeave(this)"/></td> 
     <td><p:outputLabel styleClass="errorTipClass" value="Input is invalid" 
     id="errorTip5" binding="#{errorTip5}" /></td> 
     <th><span style="color: red;">*</span>Publication Date:</th> 
     <td><p:calendar effect="fold" pattern="yyyy-MM-dd" navigator="true" 
       yearRange="c-50:#{bookView.currentYear}" lang="zh_CN" 
       id="newBookPublicationDate" placeholder="Choice book's date of publication" 
       onblur="this.style.border = '2px green solid'" readonlyInput="true" 
       value="#{bookView.newBookDate}" style="height:25px;"/></td> 
    </tr> 
    <tr> 
     <p:multiSelectListbox value="#{bookView.newBook.category}" effect="slide" header="Categories" showHeaders="true"> 
      <f:selectItems value="#{bookView.categories}" /> 
     </p:multiSelectListbox> 
    </tr> 
</table> 

我可以理解,如果你能幫助我,雖然建議。

+0

這個問題是不是JSF,相關PrimeFaces或Java-EE。這是一個普通的html問題。它會失敗,一個純html輸入或div或任何其他。你**需要一個td或th內部tr ...普通和簡單 – Kukeltje

+0

是啊。這個問題只是一個普通的html問題。我已經嘗試過這個方法作爲你的建議,然後我發佈這個問題。但是,它不工作使用colspan屬性可以解決這個問題。 –

+0

@Emil Alkalay請勿錯誤標籤。先閱讀標籤說明! –

回答

0

您需要將您的multiselectlistbox在cell.In你的情況,你將需要合併單元格:

<tr><td colspan="5"> 
    <p:multiSelectListbox value="#{bookView.newBook.category}" effect="slide" header="Categories" showHeaders="true"> 
     <f:selectItems value="#{bookView.categories}" /> 
    </p:multiSelectListbox 
</td></tr> 
+0

非常感謝。我嘗試應用此方法並在發佈此問題後成功解決此問題.MultiSelectListBox無法顯示爲我的設計的原因是默認情況下,標記td的屬性colspan爲1.感謝您的支持熱烈的回答。 –

+0

誰回答了這個問題? – Kukeltje

相關問題