2013-05-14 53 views
1

是否可以通過自定義來對Primefaces的dataTable提供的過濾文本框應用此驗證。僅允許在Primefaces中的數據表的過濾文本框(搜索過濾器)的位數

此文本框可容納的最大字符數可通過使用<p:column>filterMaxLength="45"屬性進行設置。例如。

<p:column headerText="headerText" sortBy="#{obj.properyName}" filterMaxLength="45" filterBy="#{obj.properyName}"> 
    <h:outputText value="#{obj.properyName}" /> 
</p:column> 

我看不到這樣的屬性可能通過使用正則表達式來進行其他類型的驗證,如只允許特定的字符。

無論如何,我需要允許它有唯一的數字,因爲它被映射到實體類的Long數據類型在MySQL數據庫類型BIGINT(主鍵,自動遞增)的id列。

Primefaces是否支持或有定製它的方法?

+1

AFAIK,Primefaces沒有這個選項,你可以用javascript來解決這個問題。 – 2013-05-14 11:49:40

+1

@RongNK同意。過濾器框最終將作爲可以附加自定義JavaScript的輸入字段。你可以綁定它的'key ...'事件來限制除數字之外的任何輸入。 – skuntsel 2013-05-14 12:39:31

+0

@Tiny在使用Firebug等瀏覽器工具檢查必要的文本輸入標識符/類後,您可以從[本答案](http://stackoverflow.com/a/995193/1820286)實施解決方案。 – skuntsel 2013-05-14 12:46:13

回答

2

AFAIK Primefaces沒有此選項。你可以使用JavaScript來解決這個問題。

您必須爲要限制的列設置標識,輸入(用於篩選器)的默認標識爲filter,那麼您將處理keydown event以僅允許數字。例如,我創建一種形式(id="form")和巢一個數據表(id="cars"),一個柱(id="cl2")和輸入的ID是filter,然後我結合keydown event過濾鍵哪個用戶類型:

<h:form id="form"> 
<script type="text/javascript"> 
       //<![CDATA[ 
       $(document).ready(function() { 
        $("#form\\:cars\\:cl2\\:filter").keydown(function(event) { 
         // Allow: backspace, delete, tab, escape, and enter 
         if (event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 || 
          // Allow: Ctrl+A 
         (event.keyCode == 65 && event.ctrlKey === true) || 
          // Allow: home, end, left, right 
         (event.keyCode >= 35 && event.keyCode <= 39)) { 
          // let it happen, don't do anything 
          return; 
         } 
         else { 
          // Ensure that it is a number and stop the keypress 
          if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105)) { 
           event.preventDefault(); 
          } 
         } 
        }); 
       }); 
       //]]> 
      </script> 
<p:dataTable id="cars"> 
     <p:column id="cl2" headerText="MANUFAC" filterMatchMode="contains" filterBy="#{carr.manufacturer}"> 
</p:dataTable> 

另請參見How to allow only numeric (0-9) in HTML inputbox using jQuery?

+0

已完成。如果允許更改默認ID「過濾器」,它會更好。有沒有辦法?你知道嗎?謝謝。 – Tiny 2013-05-16 08:27:32

+0

@Tiny你爲什麼想這樣做? – 2013-05-16 08:32:44

+0

沒有理由,但可能會出現這種情況,此ID可能會因Primefaces版本而異。如果是這種情況,那麼它需要修改id(如果框架已更改)。 – Tiny 2013-05-16 08:36:30

0

擴展榮阮 s答案。

在您的javascript方法中,找到Filter組件。您可以在p:column上使用filterStyleClass屬性,而不是沿着DOM樹元素進行導航。

下面是一個例子:

<p:column id="cl2" headerText="MANUFAC" filterStyleClass="filterNumbersOnly" filterMatchMode="contains" filterBy="#{carr.manufacturer}"> 

而在你的JS方法,你可以使用這個類來獲得元素:

<script type="text/javascript"> 
//<![CDATA[ 
$(document).ready(function() { 
    $(".filterNumbersOnly").keydown(function(event) { 
     //Your logic to restrict numbers only goes here 
    } 
}) 
</script> 

的優點是,因爲這種方法是CSS類基礎要素選擇。 您可以在您的應用程序中編寫一次JS函數,並將該類作爲:filterStyleClass="filterNumbersOnly"應用於整個應用程序或頁面上的任意列數。