1

私はコース最終プロジェクトに取り組んでおり、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 でモーダルが開きますが、次のエラーが表示されます。

ajaxを使用するときの私のエラー:(

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 でこれに似たチュートリアルや質問が見つからなかったため、正しい方法で行っているかどうかわかりません。

4

0 に答える 0