提交時禁用JSF表單字段驗證

Question

我有一個<h:selectOneMenu> 。 根據選擇的內容，將顯示與選擇相關的許多<div>之一，而其他隱藏。 每個<div>都有一些<h:inputText> ，它們分別寫入不同的@ViewScoped bean。 某些<div>甚至會寫入Bean中的相同屬性。

防爆。

<div>
    <h:outputLabel for="list" value="Items"/>
    <div>
        <h:message for="list"/>
        <h:selectOneMenu id="list" value="#{bean.selectedItem}" >
            <f:selectItem itemLabel="Select one"></f:selectItem>
             <f:selectItems value="bean.someItemsList" />
        </h:selectOneMenu>
    </div>
</div>

<div id="item1">
    <!-- some other input fields -->
    <div>
        <h:message for="item1input1"/>
        <h:inputText id="item3input1" value="bean.thisIsTheSameProperty" />
    </div>
</div>
<div id="item2">
    <!-- some other input fields -->
</div>
<div id="item3">
    <!-- some other input fields -->
    <div>
        <h:message for="item3input1"/>
        <h:inputText id="item3input1" value="bean.thisIsTheSameProperty" />
    </div>
</div>

問題：當我選擇一個將顯示<div> （例如<div id="item1"> ）並且還有另一個隱藏的<div> （例如<div id="item3"> ）寫為到相同的bean屬性（例如value="bean.thisIsTheSameProperty" ），並且使用javax.validation.constraints.@NotNull對該屬性進行注釋，即使我在提交表單時也給此輸入字段賦值，我認為JSF還運行隱藏的<div> （通常沒有輸入集）。

我在調試期間看到的內容：提交表單時，我看到Bean的setter將被調用兩次。 第一次使用我輸入的正確valeus設置bean屬性，但是第二次將使用空值調用setter。 因此，由於@NotNull，驗證將失敗。

我的假設是，JSF嘗試兩次設置bean值，一次用於顯示的<div>上的輸入字段，第二次設置隱藏的<div> （因為它們指向相同的bean屬性），但是設置隱藏的bean沒有設置輸入字段（它們為null）。

根據從<h:selectOneMenu>選擇的項目，我使用jQuery顯示/隱藏<div> <h:selectOneMenu> 。 防爆。

$('#item1').show();
$('#item1').hide();
$('#item2').show();
$('#item2').hide();
$('#item3').show();
$('#item3').hide();

有沒有辦法說JSF根本不考慮隱藏的<div> ？

Answer 1

您似乎假設隱藏的輸入（通過CSS隱藏）未提交到服務器。 這個假設是錯誤的，順便說一句，這是純HTML內容，與JSF無關。

請參閱例如停止提交表單中的輸入字段

但是，它仍然允許通過瀏覽器開發人員工具的客戶端操作來“攻擊”您的應用程序。 與所有被炒作的javascript UI框架相反，JSF是一個成熟的“ MVC框架 ”，它內置了針對客戶端操縱/篡改和CSRF，XSS的保護 ，而您需要在其他框架中使用OWASP相關功能。 （這一切使JSF（帶有PrimeFaces，OmniFaces和DeltaSpike）對我來說仍然是一個快速開發面向業務的應用程序的好框架。）

最好使用ajax 有條件地渲染一個div或另一個 div ，但是在定義了div就像擁有它們一樣時，您不能“更新” div 。

也可以看看：

• Ajax更新/渲染不適用於具有渲染屬性的組件
• 如何找出要進行Ajax更新/渲染的組件的客戶端ID？ 找不到從“ bar”引用的表達式為“ foo”的組件

Answer 2

@Kukeltje的答案和@drkunibar的評論對我有用。 我做了一點修改。

實際解決方案：

$('#myForm').submit(function() {
            if($('#list').find(':selected').val() === 'itemOption1') {
                $('item3').remove();
            } else if($('#list').find(':selected').val() === 'itemOption3') {
                $('item1').remove();
            }
});

我檢查以查看選擇了哪個選項。 如果選擇了option1， item3 DOM中刪除ID為item3的div ；否則，如果選擇了option3，則從DOM中刪除標識為item1的div 。 通過這種方式，綁定bean.thisIsTheSameProperty僅傳輸一個，並且不會覆蓋這些值。

謝謝。