$(document).ready(function() {
$("#tabs").tabs();
$("input[type='submit']").button();
$("input[type='button']").button();
$("#administrativo_accordion").accordion({
collapsible: true,
heightStyle: "content",
active: false
});
});
<f:view>
<h:form id="form_body" prependId="false" >
<div id="cabecalho">
<ui:include src="resources/includes/cabecalho.xhtml"/>
</div>
<div id="body">
<h:commandButton value="Novo Atendimento" action="#{c_default.redirect('novo_atendimento.fcb')}"
style="font-size: 12px; margin-bottom: 7px;">
</h:commandButton>
<div id="tabs" style="font-size: 12px; min-height: 490px; height:950%">
<ul>
<li>
<a href="#tab_pesquisa">Pesquisa</a>
</li>
<li>
<a href="#tab_atendimento">Atendimento</a>
</li>
<li>
<a href="#tab_admin">Administrativo</a>
</li>
</ul>
<div id="tab_pesquisa"> <!-- PESQUISA DE ALUNO -->
1
</div>
<div id="tab_atendimento"> <!-- PESQUISA DE ATENDIMENTO -->
2
</div>
<div id="tab_admin"> <!-- PARTE ADMINISTRATIVO -->
<div id="administrativo_accordion">
<h3 >Motivos</h3> <!-- ADMINISTRATIVO MOTIVOS -->
<div>
<h:commandButton type="button" id="btn_adicionar2" value="Adicionar" style="font-size: 12px;" />
<!--<h:commandButton id="btn_adicionarMotivo" action="#{c_default.redirectWeb('novo_motivo.fcb')}" value="Adicionar" />-->
<hr/>
<h:panelGroup id="panel_motivo">
<h:dataTable rowClasses="styleRow"
cellpadding="0"
cellspacing="0"
headerClass="tableHeaderStyle"
binding="#{c_motivo.dataTable}"
value="#{c_motivo.motivos}"
id="tabela_motivo"
var="motivo"
border="0"
style="">
<h:column>
<f:facet name="header">
<h:outputText value="ID" />
</f:facet>
<h:outputText value="#{motivo.id}"/>
</h:column>
<h:column headerClass="columnDescricao" >
<f:facet name="header" >
<h:outputText value="Descrição" />
</f:facet>
<h:outputText value="#{motivo.descricao}"/>
</h:column>
<h:column>
<h:commandButton type="button" id="btn_alterar" value="Alterar"
onclick="openDialog('dialog_editar_motivo')">
<f:ajax />
</h:commandButton>
</h:column>
<h:column>
<h:commandButton type="button" value="Excluir" action="#{c_motivo.excluir()}">
<f:ajax />
</h:commandButton>
</h:column>
</h:dataTable>
</h:panelGroup>
</div>
<h3 >Origem Encaminhamento</h3> <!-- ADMINISTRATIVO ORIGEM ENCAMINHAMENTO -->
<div>
Origem
</div>
<h3>Status</h3> <!-- ADMINISTRATIVO Status -->
<div>
Status
</div>
</div>
</div>
</div>
</div>
<div id="rodape">
<ui:include src="resources/includes/rodape.xhtml"/>
</div>
</h:form>
</f:view>
@ManagedBean(name = "c_motivo")
@ViewScoped
public class ControladoraMotivo extends ControladoraDefault implements Serializable {
@EJB
DAO_Motivos_Local dao_motivo;
Motivos motivo = new Motivos();
List<Motivos> motivos = new ArrayList<>();
private HtmlDataTable dataTable;
public HtmlDataTable getDataTable() {
return dataTable;
}
public void setDataTable(HtmlDataTable dataTable) {
this.dataTable = dataTable;
}
public List<Motivos> getMotivos() {
this.motivos = dao_motivo.findAll();
return this.motivos;
}
public void setMotivos(List<Motivos> motivos) {
this.motivos = motivos;
}
public Motivos getMotivo() {
return motivo;
}
public void setMotivo(Motivos motivo) {
this.motivo = motivo;
}
public void reinicializaMotivo() {
this.motivo = new Motivos();
}
public List<Motivos> findAll() {
this.motivos = dao_motivo.findAll();
return this.motivos;
}
public void insert() {
if (this.motivo.getDescricao() != null) {
if (!this.motivo.getDescricao().equals("")) {
if (dao_motivo.find_p_descricao(this.motivo.getDescricao()) != null) {
exibirMensagem("mensagem", "Este Motivo já existe");
} else {
dao_motivo.create(motivo);
exibirMensagem("mensagem", "Cadastro Efetuado");
}
} else {
exibirMensagem("mensagem", "Preencha o campo!");
}
}
reinicializaMotivo();
this.motivos = dao_motivo.findAll();
getDataTable().setValue(this.motivos);
updateId("tabela_motivo");
}
public void atualizaMotivo() {
this.motivo = (Motivos) getDataTable().getRowData();
}
public void excluir() {
Motivos m2 = (Motivos) getDataTable().getRowData();
this.motivos.remove(m2);
getDataTable().setValue(this.motivos);
updateId("tabela_motivo"); // FacesContext.getCurrentInstance().getPartialViewContext().getRenderIds().add(id);
}
}
Galera.. é o seguinte.. estou usando o jquery UI .. com o JSF 2.2 nativo..
estou o tabs do jquery e tal .. mas qnd uso o updateId () ... encapsulado com o método a frente do mesmo .. ele corresponde com o esperado.. ele atualiza o dataTable (id= tabela_motivo), mas o problema é que ele perde a formatação do jquery, não sei se é por causa da TAB .. mas testei de tudo.. se puderem me ajudar.. ficarei grato..
<h:outputStylesheet library="css" name="index.css"/>
<h:outputStylesheet library="css" name="jquery-ui-1.10.3.custom.css"/>
<h:outputScript library="jquery" name="jquery-1.9.1.js"/>
<h:outputScript library="jquery" name="jquery-ui.js"/>
<h:outputScript library="js" name="metodos.js"/>
Desde já, Grato!