私はコース最終プロジェクトに取り組んでおり、AJAX で JSF を使用していますが、エラーが発生しています。
現在、私は JSF 2.0 とFancybox、jQuery プラグインを使用しています。特定のページには、コンテンツをロードする dataTable が 1 つあります。この表の各行には、クリックした行の編集ページを開くリンクがあります。実際には、新しいページが開かれると、モーダルが画面に表示されるだけであることに注意してください。
したがって、ユーザーが行をクリックすると「編集ページ」が表示されますが、これはモーダルとして表示されます (これが私が Fancybox を使用している理由です)。
これを行うための私のコードは次のとおりです。
<h:dataTable id="minhaTabela" styleClass="table table-hover" var="disciplina" value="#{disciplinaMBean.listaDisciplinas}" selection="#{disciplinaMBean.disciplinaSelecionada}" selectionMode="single" >
<h:column>
<a class="various fancybox.ajax">
<f:facet name="header">Name</f:facet>
<h:outputText value="#{disciplina.nome}" />
</a>
</h:column>
</h:dataTable>
(...)
$(".various").fancybox({
maxWidth : 400,
maxHeight : 125,
fitToView : false,
autoSize : false,
width : 400,
height : 125,
closeClick : false,
openEffect : 'none',
closeEffect : 'none',
ajax : {
type : "POST",
url : "edit.xhtml",
data : { idDisciplina : '#{disciplinaMBean.disciplinaSelecionada.id}' },
dataType: "html"
}
});
そして私のedit.xhtml(まだ動的ではありません。テスト用です):
<form role="form">
<div class="form-group">
<label for="nome">Nome:</label>
<input type="text" class="form-control adicionar" id="nome" />
<br />
<a type="button" href="#" id="excluir" class="btn btn-md btn-danger pull-left">Excluir</a>
<a type="button" href="#" id="enviar" class="btn btn-lg btn-success pull-right">Salvar</a>
<br />
</div>
</form>
連続してクリックしようとすると、Fancybox でモーダルが開きますが、次のエラーが表示されます。
Fancybox で Ajax を削除すると...
(そして私のリンクに href="edit.xhtml" を追加してください)
<h:column>
<a class="various fancybox.ajax" href="edit.xhtml">
<f:facet name="header">Name</f:facet>
<h:outputText value="#{disciplina.nome}" />
</a>
</h:column>
(...)
$(".various").fancybox({
maxWidth : 400,
maxHeight : 125,
fitToView : false,
autoSize : false,
width : 400,
height : 125,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
私のページは読み込まれますが、この方法で情報を edit.xhtml に送信して情報を処理するにはどうすればよいですか? 機会を利用して、同じことを行うより良い方法はありますか? Google でこれに似たチュートリアルや質問が見つからなかったため、正しい方法で行っているかどうかわかりません。