Botão deletar no dataTable

24 de setembro de 2013 22 respostas

Viciado 24 de setembro de 2013

Olá pessoal,

Eu criei um botão de excluir dentro de um dataTable. Como eu posso chamar a minha função de excluir do meu ManagedBean?

<h:dataTable id="rounded-corner" value="#{clienteMB.carregarCliente()}" var="item">
    	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="ID" />
	      	</f:facet>
	    	<h:outputText value="#{item.id}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Nome" />
	      	</f:facet>
	    	<h:outputText value="#{item.nome}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Fone" />
	      	</f:facet>
	    	<h:outputText value="#{item.fone}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Celular" />
	      	</f:facet>
	    	<h:outputText value="#{item.celular}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Email" />
	      	</f:facet>
	    	<h:outputText value="#{item.email}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Excluir" />
	      	</f:facet>
	      	<h:link outcome="ListarCliente" class="ask" >
	      		<h:graphicImage value="images/trash.png" />
	      	</h:link>
	 	</h:column>
    </h:dataTable>

Eu tentei colocar dentro do outcome="#{clienteMB.deletarCliente(item)" mas não funcionou, também gostaria que ficasse na mesma tela atual (ListarCliente.jsf).

Obrigado

22 Respostas

Roselito_Favero_da_S 24 de set. de 2013

Eu faria quase o que você fez, mas com um commandLink dentro da coluna, e com um action ou actionListener apontando para “#{clienteMB.deletarCliente(item)”.
Particularmente, eu faço com Primefaces, mas pode fazer com o JSF, também.

Viciado 24 de set. de 2013

Roselito Fávero da Silva:
Eu faria quase o que você fez, mas com um commandLink dentro da coluna, e com um action ou actionListener apontando para “#{clienteMB.deletarCliente(item)”.
Particularmente, eu faço com Primefaces, mas pode fazer com o JSF, também.

Eu tentei com commandLink e action, mas sempre quanto carrega a tela, chama o método deletar e exclui todos os registros.

Hebert_Coelho 25 de set. de 2013

Aqui tem uma aplicação completa que mostra como fazer isso: http://uaihebert.com/?p=1414

Viciado 25 de set. de 2013

Essa aplicação não mostra como fazer isso. Não utiliza nem dataTable.

Hebert_Coelho 25 de set. de 2013

Essa aplicação não mostra como fazer isso. Não utiliza nem dataTable.É mesmo é?!
Engraçado como acabei de abrir o código fonte e ver isso aqui… <p:dataTable id=“personsTable”

É parceiro… assim fica difícil ajudar…

leonhard32 25 de set. de 2013

Viciado:

Olá pessoal,

Eu criei um botão de excluir dentro de um dataTable. Como eu posso chamar a minha função de excluir do meu ManagedBean?

<h:dataTable id="rounded-corner" value="#{clienteMB.carregarCliente()}" var="item">
    	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="ID" />
	      	</f:facet>
	    	<h:outputText value="#{item.id}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Nome" />
	      	</f:facet>
	    	<h:outputText value="#{item.nome}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Fone" />
	      	</f:facet>
	    	<h:outputText value="#{item.fone}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Celular" />
	      	</f:facet>
	    	<h:outputText value="#{item.celular}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Email" />
	      	</f:facet>
	    	<h:outputText value="#{item.email}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Excluir" />
	      	</f:facet>
	      	<h:link outcome="ListarCliente" class="ask" >
	      		<h:graphicImage value="images/trash.png" />
	      	</h:link>
	 	</h:column>
    </h:dataTable>

Eu tentei colocar dentro do outcome="#{clienteMB.deletarCliente(item)" mas não funcionou, também gostaria que ficasse na mesma tela atual (ListarCliente.jsf).

Obrigado

Use o setPropertyActionListener:

<h:commandButton action="#{clienteMB.excluir}" value="Excluir">
	      <f:setPropertyActionListener target="#{clienteMB.deletarCliente}" value="${item}" />
  </h:commandButton>

Para continuar na mesma página, só o método ser void.

[]'s

Viciado 25 de set. de 2013

leonhard32:

Viciado:

Olá pessoal,

Eu criei um botão de excluir dentro de um dataTable. Como eu posso chamar a minha função de excluir do meu ManagedBean?

<h:dataTable id="rounded-corner" value="#{clienteMB.carregarCliente()}" var="item">
    	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="ID" />
	      	</f:facet>
	    	<h:outputText value="#{item.id}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Nome" />
	      	</f:facet>
	    	<h:outputText value="#{item.nome}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Fone" />
	      	</f:facet>
	    	<h:outputText value="#{item.fone}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Celular" />
	      	</f:facet>
	    	<h:outputText value="#{item.celular}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Email" />
	      	</f:facet>
	    	<h:outputText value="#{item.email}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Excluir" />
	      	</f:facet>
	      	<h:link outcome="ListarCliente" class="ask" >
	      		<h:graphicImage value="images/trash.png" />
	      	</h:link>
	 	</h:column>
    </h:dataTable>

Eu tentei colocar dentro do outcome="#{clienteMB.deletarCliente(item)" mas não funcionou, também gostaria que ficasse na mesma tela atual (ListarCliente.jsf).

Obrigado

Use o setPropertyActionListener:

<h:commandButton action="#{clienteMB.excluir}" value="Excluir">
	      <f:setPropertyActionListener target="#{clienteMB.deletarCliente}" value="${item}" />
  </h:commandButton>

Para continuar na mesma página, só o método ser void.

[]'s

Obrigado, eu tentei fazer o que você disse mas ao clicar no botão excluir não acontece nada.
O meu ManagedBean é:

package br.com.teste.managedbean;

import java.util.ArrayList;
import java.util.List;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.naming.InitialContext;
import javax.naming.NamingException;


import br.com.teste.ejb.ClienteBean;
import br.com.teste.entidade.Cliente;

@ManagedBean
@ViewScoped
public class ClienteMB {

	private Cliente cliente = new Cliente();
	private List<Cliente> lstCliente =  new ArrayList<Cliente>();
	
	public String incluirCliente(){
		InitialContext ini;
		try {
			ini = new InitialContext();
		
			ClienteBean clienteBean = (ClienteBean)ini.lookup("java:module/ClienteBean");
			
			return clienteBean.salvar(cliente);
			
		} catch (NamingException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
			return null;
		}
	}
	
	public String deletarCliente(Cliente cliente){
		InitialContext ini;
		
		try {
			ini = new InitialContext();
			
			ClienteBean clienteBean = (ClienteBean)ini.lookup("java:module/ClienteBean");
			clienteBean.deletar(cliente);
			
			cliente = new Cliente();
			lstCliente = clienteBean.buscarCliente();
		} catch (NamingException e) {
			e.printStackTrace();
		}
		
		return null;
	}
	
	public String atualizarCliente(Cliente cliente){
		InitialContext ini;
		
		try {
			ini = new InitialContext();
			
			ClienteBean clienteBean = (ClienteBean)ini.lookup("java:module/ClienteBean");
			clienteBean.atualizar(cliente);
			
			cliente = new Cliente();
			lstCliente = clienteBean.buscarCliente();
		} catch (NamingException e) {
			e.printStackTrace();
		}
		
		return null;
	}
	
	public List<Cliente> carregarCliente(){
		List<Cliente> listaClientes =  new ArrayList<Cliente>();
		InitialContext ini;
		
		try {
			ini = new InitialContext();
			
			ClienteBean clienteBean = (ClienteBean)ini.lookup("java:module/ClienteBean");
			
			listaClientes = clienteBean.buscarCliente();
		} catch (NamingException e) {
			e.printStackTrace();
		}
		
		return listaClientes;
	}

	public Cliente getCliente() {
		return cliente;
	}

	public void setCliente(Cliente cliente) {
		this.cliente = cliente;
	}

	public List<Cliente> getLstCliente() {
		return lstCliente;
	}

	public void setLstCliente(List<Cliente> lstCliente) {
		this.lstCliente = lstCliente;
	}
	
}

leonhard32 25 de set. de 2013

Sobre o seu metodo remover, você está recebendo o objeto Cliente, crie um atributo no seu bean, algo como:

private Cliente clienteSelecionado;
  
  //getters e setters

E no setPropertyActionListener, atribua o valor ao objeto selecionado, e ao remover, remova através deste objeto também:

<f:setPropertyActionListener target="#{clienteMB.clienteSelecionado}" value="${item}" />

[]'s

Viciado 25 de set. de 2013

leonhard32:
Sobre o seu metodo remover, você está recebendo o objeto Cliente, crie um atributo no seu bean, algo como:
private Cliente clienteSelecionado;
  
  //getters e setters
E no setPropertyActionListener, atribua o valor ao objeto selecionado, e ao remover, remova através deste objeto também:
<f:setPropertyActionListener target="#{clienteMB.clienteSelecionado}" value="${item}" />
[]'s

Nesse caso a ação de deletar vai ficar no setPropertyActionListener, certo? Então o que eu preciso colocar no action no commandButton?

leonhard32 26 de set. de 2013

Viciado:
leonhard32:
Sobre o seu metodo remover, você está recebendo o objeto Cliente, crie um atributo no seu bean, algo como:
private Cliente clienteSelecionado;
  
  //getters e setters
E no setPropertyActionListener, atribua o valor ao objeto selecionado, e ao remover, remova através deste objeto também:
<f:setPropertyActionListener target="#{clienteMB.clienteSelecionado}" value="${item}" />
[]'s
Nesse caso a ação de deletar vai ficar no setPropertyActionListener, certo? Então o que eu preciso colocar no action no commandButton?

Não, no setProperty você vai atribuir o objeto na propriedade clienteSelecionado seu bem, e no commandButton você chama o método (sem nenhum argumento neste método)

[]'s

Viciado 29 de set. de 2013

leonhard32:
Viciado:
leonhard32:
Sobre o seu metodo remover, você está recebendo o objeto Cliente, crie um atributo no seu bean, algo como:
private Cliente clienteSelecionado;
  
  //getters e setters
E no setPropertyActionListener, atribua o valor ao objeto selecionado, e ao remover, remova através deste objeto também:
<f:setPropertyActionListener target="#{clienteMB.clienteSelecionado}" value="${item}" />
[]'s
Nesse caso a ação de deletar vai ficar no setPropertyActionListener, certo? Então o que eu preciso colocar no action no commandButton?
Não, no setProperty você vai atribuir o objeto na propriedade clienteSelecionado seu bem, e no commandButton você chama o método (sem nenhum argumento neste método)

[]'s

Amigo, desculpa a demora. Estava com uns problemas.
Tentei fazer o que você falou, mas ao clicar no botão excluir não acontece nada, nem chama o método deletar.

Meu MB:

package br.com.teste.managedbean;

import java.util.ArrayList;
import java.util.List;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.naming.InitialContext;
import javax.naming.NamingException;


import br.com.teste.ejb.ClienteBean;
import br.com.teste.entidade.Cliente;

@ManagedBean
@ViewScoped
public class ClienteMB {

	private Cliente cliente = new Cliente();
	private Cliente clienteSelecionado =  new Cliente();
	private List<Cliente> lstCliente =  new ArrayList<Cliente>();
	
	public String incluirCliente(){
		InitialContext ini;
		try {
			ini = new InitialContext();
		
			ClienteBean clienteBean = (ClienteBean)ini.lookup("java:module/ClienteBean");
			
			return clienteBean.salvar(cliente);
			
		} catch (NamingException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
			return null;
		}
	}
	
	public String deletarCliente(){
		InitialContext ini;
		
		try {
			ini = new InitialContext();
			
			ClienteBean clienteBean = (ClienteBean)ini.lookup("java:module/ClienteBean");
			clienteBean.deletar(getClienteSelecionado());
			
		} catch (NamingException e) {
			e.printStackTrace();
		}
		
		return null;
	}
	
	public String atualizarCliente(Cliente cliente){
		InitialContext ini;
		
		try {
			ini = new InitialContext();
			
			ClienteBean clienteBean = (ClienteBean)ini.lookup("java:module/ClienteBean");
			clienteBean.atualizar(cliente);
			
			cliente = new Cliente();
			lstCliente = clienteBean.buscarCliente();
		} catch (NamingException e) {
			e.printStackTrace();
		}
		
		return null;
	}
	
	public List<Cliente> carregarCliente(){
		List<Cliente> listaClientes =  new ArrayList<Cliente>();
		InitialContext ini;
		
		try {
			ini = new InitialContext();
			
			ClienteBean clienteBean = (ClienteBean)ini.lookup("java:module/ClienteBean");
			
			listaClientes = clienteBean.buscarCliente();
		} catch (NamingException e) {
			e.printStackTrace();
		}
		
		return listaClientes;
	}

	public Cliente getCliente() {
		return cliente;
	}

	public void setCliente(Cliente cliente) {
		this.cliente = cliente;
	}

	public List<Cliente> getLstCliente() {
		return lstCliente;
	}

	public void setLstCliente(List<Cliente> lstCliente) {
		this.lstCliente = lstCliente;
	}

	public Cliente getClienteSelecionado() {
		return clienteSelecionado;
	}

	public void setClienteSelecionado(Cliente clienteSelecionado) {
		this.clienteSelecionado = clienteSelecionado;
	}
	
}

Meu clienteBean:

package br.com.teste.ejb;

import java.util.List;

import javax.ejb.Stateless;
import javax.persistence.EntityManager;
import javax.persistence.PersistenceContext;

import br.com.teste.entidade.Cliente;

@Stateless
public class ClienteBean {
	
	@PersistenceContext
	EntityManager em;
	
	public String salvar(Cliente cliente) {
		em.persist(cliente);
		return "PaginaListarCliente";
	}
	
	public void deletar(Cliente cliente) {
		em.remove(em.getReference(Cliente.class, cliente.getId()));
	}
	
	public void atualizar(Cliente cliente) {
		em.merge(em.getReference(Cliente.class, cliente.getId()));
	}
	
	public List<Cliente> buscarCliente(){
		return em.createQuery("FROM Cliente").getResultList();
	}
}

Meu dataTable:

<h:dataTable id="rounded-corner" value="#{clienteMB.carregarCliente()}" var="item">
    	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="ID" />
	      	</f:facet>
	    	<h:outputText value="#{item.id}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Nome" />
	      	</f:facet>
	    	<h:outputText value="#{item.nome}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Fone" />
	      	</f:facet>
	    	<h:outputText value="#{item.fone}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Celular" />
	      	</f:facet>
	    	<h:outputText value="#{item.celular}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Email" />
	      	</f:facet>
	    	<h:outputText value="#{item.email}"/>
	 	</h:column>
	 	<h:column>	    	
	      	<h:commandButton action="#{clienteMB.deletarCliente()}" value="Excluir">
	      		<f:setPropertyActionListener target="#{clienteMB.clienteSelecionado}" value="${item}" />
  			</h:commandButton>
	 	</h:column>
    </h:dataTable>

leonhard32 30 de set. de 2013

Humm, uma pergunta, em algum momento, há alguma ação com ajax onde você atualiza os dados da tabela através do “update”?

Viciado 30 de set. de 2013

Eu ainda não tenho nada de ajax. Por enquanto eu carrego a página novamente para atualizar a tabela.

Roselito_Favero_da_S 30 de set. de 2013

Vamos fazer um teste:

1 - na linha 34 do seu xhtml mude para #{item}, em vez de ${item}

2 - dentro do método deletarCliente, já na linha 41, mande imprimir o valor de clienteSelecionado.nome, por exemplo.

Posta os resultados pra gente.

Viciado 30 de set. de 2013

Roselito Fávero da Silva:
Vamos fazer um teste:

1 - na linha 34 do seu xhtml mude para #{item}, em vez de ${item}

2 - dentro do método deletarCliente, já na linha 41, mande imprimir o valor de clienteSelecionado.nome, por exemplo.

Posta os resultados pra gente.

Roselito, alterei o xhtml mas como eu tinha dito. Não entra no método deletarCliente()
Eu não sei o que está acontecendo mas não chama a função deletarCliente()

Roselito_Favero_da_S 30 de set. de 2013

Então está dando erro em outro lugar. Coloca no seu xhtml um

pra ver se mostra alguma coisa.

Viciado 30 de set. de 2013

Roselito Fávero da Silva:
Então está dando erro em outro lugar. Coloca no seu xhtml um
pra ver se mostra alguma coisa.

Roselito,

Não mostrou nada.

Roselito_Favero_da_S 30 de set. de 2013

Assombroso… tem como colocar o xhtml inteiro pra gente ver?

Viciado 30 de set. de 2013

Claro, o meu xhtml ainda está em fase de adaptação e aprendizado, deve ter muitos erros. Mas toda crítica é bem vinda.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:h="http://java.sun.com/jsf/html"
	  xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Teste</title>
<link rel="stylesheet" type="text/css" href="CSS/style.css" />
<script type="text/javascript" src="js/clockp.js"></script>
<script type="text/javascript" src="js/clockh.js"></script> 
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/ddaccordion.js"></script>
<script type="text/javascript">
ddaccordion.init({
	headerclass: "submenuheader", //Shared CSS class name of headers group
	contentclass: "submenu", //Shared CSS class name of contents group
	revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
	mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
	collapseprev: true, //Collapse previous content (so only one open at any time)? true/false 
	defaultexpanded: [], //index of content(s) open by default [index1, index2, etc] [] denotes no content
	onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
	animatedefault: false, //Should contents open by default be animated into view?
	persiststate: true, //persist state of opened contents within browser session?
	toggleclass: ["", ""], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
	togglehtml: ["suffix", "<img src='images/plus.gif' class='statusicon' />", "<img src='images/minus.gif' class='statusicon' />"], //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"] (see docs)
	animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
	oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
		//do nothing
	},
	onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
		//do nothing
	}
})
</script>

<script type="text/javascript" src="js/jconfirmaction.jquery.js"></script>
<script type="text/javascript">
	
	$(document).ready(function() {
		$('.ask').jConfirmAction();
	});
	
</script>

<script language="javascript" type="text/javascript" src="js/niceforms.js"></script>
<link rel="stylesheet" type="text/css" media="all" href="CSS/niceforms-default.css" />

</head>
<h:messages showDetail="true" showSummary="true" />  
<body>
<div id="main_container">

	<div class="header">
    <div class="logo"><a href="#"><img src="images/logo.gif" alt="" title="" border="0" /></a></div>
    
    <div class="right_header">Welcome Admin, <a href="#">Visit site</a> | <a href="#" class="messages">(3) Messages</a> | <a href="#" class="logout">Logout</a></div>
    <div id="clock_a"></div>
    </div>
    
    <div class="main_content">
    
                    <div class="menu">
                    <ul>
                    <li><a class="current" href="index.html">Admin Home</a></li>
                    <li><a href="list.html">Cadastros<!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                        <ul>
                        <li><h:link outcome="ListarCliente" value="Clientes"/></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                    </li>
                    <li><a href="login.html">Manage Users<!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                        <ul>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a class="sub1" href="" title="">sublevel2<!--[if IE 7]><!--></a><!--<![endif]-->
                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                            <ul>
                                <li><a href="" title="">sublevel link</a></li>
                                <li><a href="" title="">sulevel link</a></li>
                                <li><a class="sub2" href="#nogo">sublevel3<!--[if IE 7]><!--></a><!--<![endif]-->
                        
                                <!--[if lte IE 6]><table><tr><td><![endif]-->
                                    <ul>
                                        <li><a href="#nogo">Third level-1</a></li>
                                        <li><a href="#nogo">Third level-2</a></li>
                                        <li><a href="#nogo">Third level-3</a></li>
                                        <li><a href="#nogo">Third level-4</a></li>
                                    </ul>
                        
                                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                                </li>
                                <li><a href="" title="">sulevel link</a></li>
                            </ul>
                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                    
                         <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                    </li>
                    <li><a href="login.html">Manage Orders<!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                        <ul>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a class="sub1" href="" title="">sublevel2<!--[if IE 7]><!--></a><!--<![endif]-->
                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                            <ul>
                                <li><a href="" title="">sublevel link</a></li>
                                <li><a href="" title="">sulevel link</a></li>
                                <li><a class="sub2" href="#nogo">sublevel3<!--[if IE 7]><!--></a><!--<![endif]-->
                        
                                <!--[if lte IE 6]><table><tr><td><![endif]-->
                                    <ul>
                                        <li><a href="#nogo">Third level-1</a></li>
                                        <li><a href="#nogo">Third level-2</a></li>
                                        <li><a href="#nogo">Third level-3</a></li>
                                        <li><a href="#nogo">Third level-4</a></li>
                                    </ul>
                        
                                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                                </li>
                                <li><a href="" title="">sulevel link</a></li>
                            </ul>
                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                    
                         <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                    </li>
                    <li><a href="login.html">Settings<!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                        <ul>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a class="sub1" href="" title="">sublevel2<!--[if IE 7]><!--></a><!--<![endif]-->
                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                            <ul>
                                <li><a href="" title="">sublevel link</a></li>
                                <li><a href="" title="">sulevel link</a></li>
                                <li><a class="sub2" href="#nogo">sublevel3<!--[if IE 7]><!--></a><!--<![endif]-->
                        
                                <!--[if lte IE 6]><table><tr><td><![endif]-->
                                    <ul>
                                        <li><a href="#nogo">Third level-1</a></li>
                                        <li><a href="#nogo">Third level-2</a></li>
                                        <li><a href="#nogo">Third level-3</a></li>
                                        <li><a href="#nogo">Third level-4</a></li>
                                    </ul>
                        
                                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                                </li>
                                <li><a href="" title="">sulevel link</a></li>
                            </ul>
                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                    
                         <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                    </li>
                    <li><a href="">Templates</a></li>
                    <li><a href="">Custom details</a></li>
                    <li><a href="">Contact</a></li>
                    </ul>
                    </div> 
                    
                    
                    
                    
    <div class="center_content">   
    
    <div class="right_content">            
        
    <h2>Clientes</h2> 
    <h:dataTable id="rounded-corner" value="#{clienteMB.carregarCliente()}" var="item">
    	<h:column>
	    	<f:facet name="header">
	      		<h:link value="ID" />
	      	</f:facet>
	    	<h:outputText value="#{item.id}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Nome" />
	      	</f:facet>
	    	<h:outputText value="#{item.nome}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Fone" />
	      	</f:facet>
	    	<h:outputText value="#{item.fone}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Celular" />
	      	</f:facet>
	    	<h:outputText value="#{item.celular}"/>
	 	</h:column>
	 	<h:column>
	    	<f:facet name="header">
	      		<h:outputText value="Email" />
	      	</f:facet>
	    	<h:outputText value="#{item.email}"/>
	 	</h:column>
	 	<h:column>	    	
	      	<h:commandButton action="#{clienteMB.deletarCliente()}" value="Excluir">
	      		<f:setPropertyActionListener target="#{clienteMB.clienteSelecionado}" value="#{item}" />
  			</h:commandButton>
	 	</h:column>
    </h:dataTable>
	 
	 <h:link outcome="CadCliente" class="bt_green">
     	<span class="bt_green_lft"></span><strong>Adicionar Cliente</strong><span class="bt_green_r"></span>
     </h:link>
     <h:link outcome="CadCliente" class="bt_blue">
     	<span class="bt_blue_lft"></span><strong>Relatório</strong><span class="bt_blue_r"></span>
     </h:link>   	 
     
     
        <div class="pagination">
        <span class="disabled">prev</span><span class="current">1</span><a href="">2</a><a href="">3</a><a href="">4</a><a href="">5</a>?<a href="">10</a><a href="">11</a><a href="">12</a>...<a href="">100</a><a href="">101</a><a href="">next</a>
        </div> 
     
     </div><!-- end of right content-->
            
                    
  </div>   <!--end of center content -->               
                    
                    
    
    
    <div class="clear"></div>
    </div> <!--end of main content-->
	

</div>		
</body>
</html>

Roselito_Favero_da_S 30 de set. de 2013

Você colocou o h:messages fora do body…

Coloca logo abaixo do form… epa! sua página não tem h:form?

Viciado 30 de set. de 2013

Roselito Fávero da Silva:
Você colocou o h:messages fora do body…

Coloca logo abaixo do form… epa! sua página não tem h:form?

Você tem razão, colocando o h:form funciona a exclusão. Mas o meu datatable perde toda a formatação.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:h="http://java.sun.com/jsf/html"
	  xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Teste</title>
<link rel="stylesheet" type="text/css" href="CSS/style.css" />
<script type="text/javascript" src="js/clockp.js"></script>
<script type="text/javascript" src="js/clockh.js"></script> 
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/ddaccordion.js"></script>
<script type="text/javascript">
ddaccordion.init({
	headerclass: "submenuheader", //Shared CSS class name of headers group
	contentclass: "submenu", //Shared CSS class name of contents group
	revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
	mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
	collapseprev: true, //Collapse previous content (so only one open at any time)? true/false 
	defaultexpanded: [], //index of content(s) open by default [index1, index2, etc] [] denotes no content
	onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
	animatedefault: false, //Should contents open by default be animated into view?
	persiststate: true, //persist state of opened contents within browser session?
	toggleclass: ["", ""], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
	togglehtml: ["suffix", "<img src='images/plus.gif' class='statusicon' />", "<img src='images/minus.gif' class='statusicon' />"], //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"] (see docs)
	animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
	oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
		//do nothing
	},
	onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
		//do nothing
	}
})
</script>

<script type="text/javascript" src="js/jconfirmaction.jquery.js"></script>
<script type="text/javascript">
	
	$(document).ready(function() {
		$('.ask').jConfirmAction();
	});
	
</script>

<script language="javascript" type="text/javascript" src="js/niceforms.js"></script>
<link rel="stylesheet" type="text/css" media="all" href="CSS/niceforms-default.css" />

</head>
  
<body>
<div id="main_container">

	<div class="header">
    <div class="logo"><a href="#"><img src="images/logo.gif" alt="" title="" border="0" /></a></div>
    
    <div class="right_header">Welcome Admin, <a href="#">Visit site</a> | <a href="#" class="messages">(3) Messages</a> | <a href="#" class="logout">Logout</a></div>
    <div id="clock_a"></div>
    </div>
    
    <div class="main_content">
    
                    <div class="menu">
                    <ul>
                    <li><a class="current" href="index.html">Admin Home</a></li>
                    <li><a href="list.html">Cadastros<!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                        <ul>
                        <li><h:link outcome="ListarCliente" value="Clientes"/></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                    </li>
                    <li><a href="login.html">Manage Users<!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                        <ul>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a class="sub1" href="" title="">sublevel2<!--[if IE 7]><!--></a><!--<![endif]-->
                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                            <ul>
                                <li><a href="" title="">sublevel link</a></li>
                                <li><a href="" title="">sulevel link</a></li>
                                <li><a class="sub2" href="#nogo">sublevel3<!--[if IE 7]><!--></a><!--<![endif]-->
                        
                                <!--[if lte IE 6]><table><tr><td><![endif]-->
                                    <ul>
                                        <li><a href="#nogo">Third level-1</a></li>
                                        <li><a href="#nogo">Third level-2</a></li>
                                        <li><a href="#nogo">Third level-3</a></li>
                                        <li><a href="#nogo">Third level-4</a></li>
                                    </ul>
                        
                                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                                </li>
                                <li><a href="" title="">sulevel link</a></li>
                            </ul>
                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                    
                         <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                    </li>
                    <li><a href="login.html">Manage Orders<!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                        <ul>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a class="sub1" href="" title="">sublevel2<!--[if IE 7]><!--></a><!--<![endif]-->
                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                            <ul>
                                <li><a href="" title="">sublevel link</a></li>
                                <li><a href="" title="">sulevel link</a></li>
                                <li><a class="sub2" href="#nogo">sublevel3<!--[if IE 7]><!--></a><!--<![endif]-->
                        
                                <!--[if lte IE 6]><table><tr><td><![endif]-->
                                    <ul>
                                        <li><a href="#nogo">Third level-1</a></li>
                                        <li><a href="#nogo">Third level-2</a></li>
                                        <li><a href="#nogo">Third level-3</a></li>
                                        <li><a href="#nogo">Third level-4</a></li>
                                    </ul>
                        
                                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                                </li>
                                <li><a href="" title="">sulevel link</a></li>
                            </ul>
                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                    
                         <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                    </li>
                    <li><a href="login.html">Settings<!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                        <ul>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        <li><a class="sub1" href="" title="">sublevel2<!--[if IE 7]><!--></a><!--<![endif]-->
                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                            <ul>
                                <li><a href="" title="">sublevel link</a></li>
                                <li><a href="" title="">sulevel link</a></li>
                                <li><a class="sub2" href="#nogo">sublevel3<!--[if IE 7]><!--></a><!--<![endif]-->
                        
                                <!--[if lte IE 6]><table><tr><td><![endif]-->
                                    <ul>
                                        <li><a href="#nogo">Third level-1</a></li>
                                        <li><a href="#nogo">Third level-2</a></li>
                                        <li><a href="#nogo">Third level-3</a></li>
                                        <li><a href="#nogo">Third level-4</a></li>
                                    </ul>
                        
                                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                                </li>
                                <li><a href="" title="">sulevel link</a></li>
                            </ul>
                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                    
                         <li><a href="" title="">Lorem ipsum dolor sit amet</a></li>
                        </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                    </li>
                    <li><a href="">Templates</a></li>
                    <li><a href="">Custom details</a></li>
                    <li><a href="">Contact</a></li>
                    </ul>
                    </div> 
                    
                    
                    
                    
    <div class="center_content">   
    
    <div class="right_content">            
        
    <h2>Clientes</h2>
     
    <h:form>
    	<h:messages showDetail="true" showSummary="true" />
	    <h:dataTable id="rounded-corner" value="#{clienteMB.carregarCliente()}" var="item">
	    	<h:column>
		    	<f:facet name="header">
		      		<h:link value="ID" />
		      	</f:facet>
		    	<h:outputText value="#{item.id}"/>
		 	</h:column>
		 	<h:column>
		    	<f:facet name="header">
		      		<h:outputText value="Nome" />
		      	</f:facet>
		    	<h:outputText value="#{item.nome}"/>
		 	</h:column>
		 	<h:column>
		    	<f:facet name="header">
		      		<h:outputText value="Fone" />
		      	</f:facet>
		    	<h:outputText value="#{item.fone}"/>
		 	</h:column>
		 	<h:column>
		    	<f:facet name="header">
		      		<h:outputText value="Celular" />
		      	</f:facet>
		    	<h:outputText value="#{item.celular}"/>
		 	</h:column>
		 	<h:column>
		    	<f:facet name="header">
		      		<h:outputText value="Email" />
		      	</f:facet>
		    	<h:outputText value="#{item.email}"/>
		 	</h:column>
		 	<h:column>	    	
		      	<h:commandButton action="#{clienteMB.deletarCliente()}" value="Excluir">
		      		<f:setPropertyActionListener target="#{clienteMB.clienteSelecionado}" value="#{item}" />
	  			</h:commandButton>
		 	</h:column>
	    </h:dataTable>
		 
		 <h:link outcome="CadCliente" class="bt_green">
	     	<span class="bt_green_lft"></span><strong>Adicionar Cliente</strong><span class="bt_green_r"></span>
	     </h:link>
	     <h:link outcome="CadCliente" class="bt_blue">
	     	<span class="bt_blue_lft"></span><strong>Relatório</strong><span class="bt_blue_r"></span>
	     </h:link>
		</h:form>   	 
     
     
        <div class="pagination">
        <span class="disabled">prev</span><span class="current">1</span><a href="">2</a><a href="">3</a><a href="">4</a><a href="">5</a>?<a href="">10</a><a href="">11</a><a href="">12</a>...<a href="">100</a><a href="">101</a><a href="">next</a>
        </div> 
     
     </div><!-- end of right content-->
            
                    
  </div>   <!--end of center content -->               
                    
                    
    
    
    <div class="clear"></div>
    </div> <!--end of main content-->


</div>		
</body>
</html>

Viciado 30 de set. de 2013

Resolvido o problema da formatação.
Foi só alterar o h:form que continuou pegando as propriedades do meu CSS.

<h:form prependId="false">

Valeu!

Criado 24 de setembro de 2013

Ultima resposta 30 de set. de 2013

Respostas 22

Participantes 4

22 Respostas

Topicos relacionados