如何在p：對話框中觸發ajax事件

因此，當組件更改值時，我今天大部分時間都試圖調用支持bean中的方法。如果我的組件位於<p:dialog>之外，則一切正常，但嵌套在對話框中時，服務器端永遠不會發生。最初我正在與<p:calendar>控件一起工作，但注意到它也無法使用簡單的inputText。下面的示例工作：如何在p：對話框中觸發ajax事件

<h:panelGrid columns="3"> 
    <h:outputText value="Start"/> 
    <p:inputText id="startOfRange" value="#{myBean.startRange}" valueChangeListener="#{myBean.startChanged}"> 
     <p:ajax event="change" update="play"/> 
    </p:inputText> 
    <h:outputText id="play" style="margin-left: 10px;" value="#{myBean.startRange}"/> 
</h:panelGrid>

我支持bean方法看起來像

public void startChanged(ValueChangeEvent event) { }

這種方法是一個標籤出的inputText後調用，但是當裹得像以下方法不會被調用：

<p:dialog widgetVar="efDlg" zindex="10" appendToBody="true" header="Create Custom Date Range" 
     modal="true" height="375" width="450" resizable="false" closable="false" > 
<h:panelGrid columns="4"> 
    <h:outputText value="Start"/> 
    <p:inputText id="startOfRange" value="#{myBean.startRange}" valueChangeListener="#{myBean.startChanged}"> 
     <p:ajax event="change" update="play"/> 
    </p:inputText> 
    <h:outputText id="play" style="margin-left: 10px;" value="#{myBean.startRange}"/> 
    <p:inputText id="endOfRange" value="#{myBean.endRange}" valueChangeListener="#{myBean.endChanged}"/> 
</h:panelGrid> 
<div class="customRangeButtons"> 
    <span> 
     <p:commandButton value="Cancel" onstart="efDlg.hide();" actionListener="#{myBean.cancelCustomDateRange}" update="pGraphs"/> 
    </span> 
    <span style="margin-left: 300px;"> 
     <p:commandButton value="Ok" type="submit" onstart="efDlg.hide();" action="#{myBean.saveCustomDateRange()}" update="pGraphs"/> 
    </span> 
</div>  
</p:dialog>

注意我在Mojarra 2.1.0中使用Primefaces 2.2.1。任何想法，爲什麼我不能調用startChanged方法時值被改變？

來源

2011-08-04 Boiler Bill

作爲一項解決方案，我切換了p：dialog並手動製作了一個jQuery對話框。這很好。 –

這是一個明智的選擇。即使2.2.1是穩定版本，它也有很多方法可以與對話組件一起使用。這些是常見的和反覆出現的主題，其中某些組件行爲在包含在對話框中時是不同的或不存在的。從我收集的內容來看，它主要與底層YUI對話框將DOM元素物理地移入和移出表單的方式有關。 –

我一直有''的主要問題。我認爲它不適合使用''的Facelet頁面。不知道你是否也使用佈局。我希望他們能夠在未來的版本中穩定對話。 –

也許我對這種錯誤（我沒有我的項目代碼在家驗證），但不是這樣的：

<p:ajax event="change" update="play"/>

應該是：

<p:ajax event="valueChange" update="play"/>

我知道大部分Ajax event值與刪除了'on'的JavaScript事件處理程序相似，但valueChange是JSF Ajax標記中的特殊值。

爲了記錄在案，我有時會將兩個阿賈克斯子標籤的inputText的內部，如：

<p:ajax event="valueChange" process="@this" update="whatever"/> 
<p:ajax event="keyUp" process="@this" update="whatever"/>

這將處理它的每個按鍵輸入，以及複製和粘貼和損失注重父母輸入文字。

來源

2011-08-05 01:44:44

「event =」valueChange「'確實有特殊的含義。它將呈現爲HTML文本框，textareas和下拉菜單的「onchange」，以及HTML單選按鈕和複選框的「onclick」。但是，在這種特殊情況下，'event =「change」'與文本框中使用的效果完全相同。根本原因可能是''實際上需要自己的''（它不應該嵌套！）。至少，RichFaces也有類似的問題。 – BalusC

感謝您對'valueChange'的澄清。我認爲你對對話和形式可能是正確的。PrimeFaces展示示例往往會以自己的形式出現對話框。另外，我看到OP正在使用'appendToBody =「true」'屬性。這似乎是解決他們遇到的問題的一種解決方法。如果我的頁面模板使用''，我必須在我的webapp中使用它，否則對話框將無法正確呈現。也許它是相關的？我不知道。 –

我也遇到過同樣的問題。我也在對話框中使用單個窗體並且沒有窗體。只要我的對話框中沒有appendToBody =「true」，輸入值和ajax和提交就會正確發生。只要我用true添加該屬性，爲了更好/正確的渲染，輸入值不被接受。

來源

2011-11-16 14:40:24

如何在p：對話框中觸發ajax事件

回答

相關問題