我正在研究我的课程最终项目,我正在使用JSF和AJAX,但我遇到了一些错误。
目前我正在使用JSF 2.0和Fancybox,这是一个jQuery插件。在给定的页面中,我有一个dataTable来加载我的内容。该表的每一行都有一个链接,该链接将打开所单击行的编辑页面。请注意,在打开任何新页面的情况下,屏幕上只会显示一个模式。
因此,当用户点击行时,会出现“编辑页面”,但这将显示为模态(这就是我使用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打开模态,但是我收到以下错误:
(并将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处理信息?抓住机会,这是做同样事情的更好方法吗?我不知道我是否采取了正确的方式,因为我没有在谷歌找到任何类似的教程或问题。