Fazer button deletar dado de uma tabela em JSP

18 de março de 2013 6 respostas

F.Engel 18 de março de 2013

Bom dia, eu não estou conseguindo fazer o button deletar um dado de uma tabela que está dentro de um form em um .jsp

Button:

<a href="${pageContext.request.contextPath}/admin/menus/${menu.id}" method="delete"  > <input type="hidden" value="delete"/>
                     <button  class="btn btn-small" rel="tooltip" data-placement="botton" data-original-title="Deletar" type="submit"  onclick="return confirm('Deseja mesmo excluir?')" ><i class="gicon-remove-circle" ></i></button>
         			</a>

que está dentro desse form:

<form method="" action="" name="frm">
          <table id="datatable_example" class="responsive table table-striped table-bordered" style="width:100%;margin-bottom:0; ">
            <thead>
              <tr>
                <th class="jv no_sort"><label><center><input type="checkbox" name="allCheck" onClick="selectallMe()"></center></label></th>
                 <th class="">Nome</th>
                 <th class="to_hide_phone ue no_sort">Situacao</th>
                 <th class="">Data Criacao</th>
                <th class="ms no_sort ">Acoes</th>
              </tr>
            </thead>
            <tbody>
             <c:forEach items="${menu}" var="menu">
              <tr>
                <td><label><center><input type="checkbox" name="chkName" onClick="selectall()" value="${menu.id}"></center></label></td>
                <td class="">${menu.nome}</td>
                <td class="to_hide_phone">${menu.situacao}</td>
                <td><fmt:formatDate pattern="dd/MM/yyyy" value="${menu.dataCriacao}" /></td>
               
                <td class="ms">
                  <div class="btn-group1">
                    <a href="${pageContext.request.contextPath}/admin/menus/${menu.id}/edit" class="btn btn-small"  rel="tooltip" data-placement="left" data-original-title="Editar"><i class="gicon-edit"></i></a>
                    <a href="${pageContext.request.contextPath}/admin/menus/${menu.id}" class="btn btn-small" rel="tooltip" data-placement="top" data-original-title="View"><i class="gicon-eye-open"></i></a>
                    <a href="${pageContext.request.contextPath}/admin/menus/${menu.id}" method="delete"  > <input type="hidden" value="delete"/>
                     <button  class="btn btn-small" rel="tooltip" data-placement="botton" data-original-title="Deletar" type="submit"  onclick="return confirm('Deseja mesmo excluir?')" ><i class="gicon-remove-circle" ></i></button>
         			</a>
                  </div>
                </td>
              </tr>
             </c:forEach>             
            </tbody>
          </table>
          </form>

e controller pra deletar que esta num .java:

@Delete("/menus/{menu.id}")
	@RestritoAdmin
	public void destroy(Menu menu) {
		repository.destroy(repository.find(menu.getId()));
		result.forwardTo("/WEB-INF/jsp/admin/menu/index.jsp"); 
	}

sou meio novato nisso, então alguem saberia me dizer onde ou o que eu fiz de errado ??? ah, estou usando o vraptor ...

6 Respostas

DaniloAndrade 18 de mar. de 2013

primeiro:

<form method="" action="" name="frm">  //tirar esse form
          <table id="datatable_example" class="responsive table table-striped table-bordered" style="width:100%;margin-bottom:0; ">  
            <thead>  
              <tr>  
                <th class="jv no_sort"><label><center><input type="checkbox" name="allCheck" onClick="selectallMe()"></center></label></th>  
                 <th class="">Nome</th>  
                 <th class="to_hide_phone ue no_sort">Situacao</th>  
                 <th class="">Data Criacao</th>  
                <th class="ms no_sort ">Acoes</th>  
              </tr>  
            </thead>  
            <tbody>  
             <c:forEach items="${menu}" var="menu">  
              <tr>  
                <td><label><center><input type="checkbox" name="chkName" onClick="selectall()" value="${menu.id}"></center></label></td>  
                <td class="">${menu.nome}</td>  
                <td class="to_hide_phone">${menu.situacao}</td>  
                <td><fmt:formatDate pattern="dd/MM/yyyy" value="${menu.dataCriacao}" /></td>  
                 
                <td class="ms">  
                  <div class="btn-group1">  
                    <a href="${pageContext.request.contextPath}/admin/menus/${menu.id}/edit" class="btn btn-small"  rel="tooltip" data-placement="left" data-original-title="Editar"><i class="gicon-edit"></i></a>  
                    <a href="${pageContext.request.contextPath}/admin/menus/${menu.id}" class="btn btn-small" rel="tooltip" data-placement="top" data-original-title="View"><i class="gicon-eye-open"></i></a>  
                    <a href="${pageContext.request.contextPath}/admin/menus/${menu.id}" method="delete"  > <input type="hidden" value="delete"/>  
                     <button  class="btn btn-small" rel="tooltip" data-placement="botton" data-original-title="Deletar" type="submit"  onclick="return confirm('Deseja mesmo excluir?')" ><i class="gicon-remove-circle" ></i></button>  
                    </a>  
                  </div>  
                </td>  
              </tr>  
             </c:forEach>               
            </tbody>  
          </table>  
          </form> //tirar esse forme

tira esse form em volta da tabela

agora vc tem duas opções

primeira opção

<a href="${pageContext.request.contextPath}/admin/menus/${menu.id}" method="delete"  > <input type="hidden" value="delete"/>  
                     <button  class="btn btn-small" rel="tooltip" data-placement="botton" data-original-title="Deletar" type="submit"  onclick="return confirm('Deseja mesmo excluir?')" ><i class="gicon-remove-circle" ></i></button>  
                    </a>

tira esse a e colocar o form no lugar

ficando assim

<form method="post" action="${pageContext.request.contextPath}/admin/menus/${menu.id}"> 
              <input type="hidden" value="delete"/>  
              <button  class="btn btn-small" rel="tooltip" data-placement="botton" data-original-title="Deletar" type="submit"  onclick="return confirm('Deseja mesmo excluir?')" >
<i class="gicon-remove-circle" ></i></button>  
</form>

a segunda opção é

tira o e deixando apenas o button e no onclick chame uma função que vc ira criar e passe o id como parametro da função

na função vc vai fazer isso:

function deletar(idMenu){
 if(confirm('Deseja mesmo excluir?')){
   $('#idMenuExcluir').val(idMenu); // vai setar o valor no input de id "idMenuExcluir"
  $('#formExcluirMenu').submit();

}

}

e vc vai criar tambem o form fora da tabela

<form method="post" action="${pageContext.request.contextPath}/admin/menus/" id="formExcluirMenu"> 
<input type="hidden" value="delete" />// acho que aqui vc precisa colocar o name tambem 
<input type="hidden" name="menu.id" id="idMenuExcluir" />
</form>

vê se isso ajuda

F.Engel 18 de mar. de 2013

Obrigado pela ajuda, mas ele está chamando a função certo, mas ainda não está excluindo ... a função e o form fora da tabela deixei conforme voc me passou, e no button deixei assim:

<button  class="btn btn-small" rel="tooltip" data-placement="botton"  type="submit"  onclick="deletar()" ><i class="gicon-remove-circle" ></i></button>

ou seja, ficou assim:

<form name="frm">
          <table id="datatable_example" class="responsive table table-striped table-bordered" style="width:100%;margin-bottom:0; ">
            <thead>
              <tr>
                <th class="jv no_sort"><label><center><input type="checkbox" name="allCheck" onClick="selectallMe()"></center></label></th>
                 <th class="">Nome</th>
                 <th class="to_hide_phone ue no_sort">Situacao</th>
                 <th class="">Data Criacao</th>
                <th class="ms no_sort ">Acoes</th>
              </tr>
            </thead>
            <tbody>
             <c:forEach items="${menu}" var="menu">
              <tr>
                <td><label><center><input type="checkbox" name="chkName" onClick="selectall()" value="${menu.id}"></center></label></td>
                <td class="">${menu.nome}</td>
                <td class="to_hide_phone">${menu.situacao}</td>
                <td><fmt:formatDate pattern="dd/MM/yyyy" value="${menu.dataCriacao}" /></td>
               
                <td class="ms">
                  <div class="btn-group1">
                    <a href="${pageContext.request.contextPath}/admin/menus/${menu.id}/edit" class="btn btn-small"  rel="tooltip" data-placement="left" data-original-title="Editar"><i class="gicon-edit"></i></a>
                    <a href="${pageContext.request.contextPath}/admin/menus/${menu.id}" class="btn btn-small" rel="tooltip" data-placement="top" data-original-title="View"><i class="gicon-eye-open"></i></a>
                    <button  class="btn btn-small" rel="tooltip" data-placement="botton"  type="submit"  onclick="deletar()" ><i class="gicon-remove-circle" ></i></button>
                  </div>
                </td>
              </tr>
             </c:forEach>             
            </tbody>
          </table>
          </form>
          <form method="post" action="${pageContext.request.contextPath}/admin/menus/" id="formExcluirMenu">   
		  <input type="hidden" value="delete" /> 
		  <input type="hidden" name="menu.id" id="idMenuExcluir" />  
		  </form>

e precisa mesmo tirar o form em volta da tabela ?? é que sem ele a função para selecionar/de-selecionar todos os checkbox não funciona .... mas a respeito do que voc me passou, fiz algo de errado ?

ViniGodoy 18 de mar. de 2013

Por favor, ao abrir tópicos, dê um título descritivo. 99% dos tópicos são um pedido de ajuda, não adianta nada colocar no título “Ajuda!!”

DaniloAndrade 18 de mar. de 2013

F.Engel:

Obrigado pela ajuda, mas ele está chamando a função certo, mas ainda não está excluindo ... a função e o form fora da tabela deixei conforme voc me passou, e no button deixei assim:

<button  class="btn btn-small" rel="tooltip" data-placement="botton"  type="submit"  onclick="deletar()" ><i class="gicon-remove-circle" ></i></button>

ou seja, ficou assim:

<form name="frm">
          <table id="datatable_example" class="responsive table table-striped table-bordered" style="width:100%;margin-bottom:0; ">
            <thead>
              <tr>
                <th class="jv no_sort"><label><center><input type="checkbox" name="allCheck" onClick="selectallMe()"></center></label></th>
                 <th class="">Nome</th>
                 <th class="to_hide_phone ue no_sort">Situacao</th>
                 <th class="">Data Criacao</th>
                <th class="ms no_sort ">Acoes</th>
              </tr>
            </thead>
            <tbody>
             <c:forEach items="${menu}" var="menu">
              <tr>
                <td><label><center><input type="checkbox" name="chkName" onClick="selectall()" value="${menu.id}"></center></label></td>
                <td class="">${menu.nome}</td>
                <td class="to_hide_phone">${menu.situacao}</td>
                <td><fmt:formatDate pattern="dd/MM/yyyy" value="${menu.dataCriacao}" /></td>
               
                <td class="ms">
                  <div class="btn-group1">
                    <a href="${pageContext.request.contextPath}/admin/menus/${menu.id}/edit" class="btn btn-small"  rel="tooltip" data-placement="left" data-original-title="Editar"><i class="gicon-edit"></i></a>
                    <a href="${pageContext.request.contextPath}/admin/menus/${menu.id}" class="btn btn-small" rel="tooltip" data-placement="top" data-original-title="View"><i class="gicon-eye-open"></i></a>
                    <button  class="btn btn-small" rel="tooltip" data-placement="botton"  type="submit"  onclick="deletar()" ><i class="gicon-remove-circle" ></i></button>
                  </div>
                </td>
              </tr>
             </c:forEach>             
            </tbody>
          </table>
          </form>
          <form method="post" action="${pageContext.request.contextPath}/admin/menus/" id="formExcluirMenu">   
		  <input type="hidden" value="delete" /> 
		  <input type="hidden" name="menu.id" id="idMenuExcluir" />  
		  </form>

falta vc passar o id do menu na função

F.Engel 18 de mar. de 2013

esses são os meus controllers:

@Get("/menus")
	@RestritoAdmin
	public void index() {
		result.include("menu", repository.findAll());
		result.forwardTo("/WEB-INF/jsp/admin/menu/index.jsp");	
	}
	
	@Post("/menus")
	@RestritoAdmin
	public void create(Menu menu) {
		validator.validate(menu);
		menu.setDataCriacao(new Date());
		validator.onErrorUsePageOf(this).newMenu();
		repository.create(menu);
		result.redirectTo(this).index();
	}
	
	@Get("/menus/new")
	@RestritoAdmin
	public void newMenu() {
		result.forwardTo("/WEB-INF/jsp/admin/menu/newMenu.jsp");
	}
	
	@Put("/menus")
	@RestritoAdmin
	public void update(Menu menu) {
		menu.setDataAtualizacao(new Date());
		validator.validate(menu);
		validator.onErrorUsePageOf(this).edit(menu);
		repository.update(menu);
		result.forwardTo("/WEB-INF/jsp/admin/menu/index.jsp");
	}
	
	@Get("/menus/{menu.id}/edit")
	@RestritoAdmin
	public void edit(Menu menu) {	
		result.include("menu",repository.find(menu.getId()));
		result.forwardTo("/WEB-INF/jsp/admin/menu/edit.jsp");
	}

	@Get("/menus/{menu.id}")
	@RestritoAdmin
	public void show(Menu menu) {
		result.include("menu",repository.find(menu.getId()));
		result.forwardTo("/WEB-INF/jsp/admin/menu/show.jsp");
	}

	@Delete("/menus/{menu.id}")
	@RestritoAdmin
	public void destroy(Menu menu) {
		repository.destroy(repository.find(menu.getId()));
		result.forwardTo("/WEB-INF/jsp/admin/menu/index.jsp"); 
	}

e nesse form que voc me pediu pra colocar:

<form action="${pageContext.request.contextPath}/admin/menus/" method="post" id="formExcluirMenu">   
		  <input type="hidden" value="delete" /> 
		  <input type="hidden" name="menu.id" id="idMenuExcluir" value=""/>  
		  </form>

ele está chamando o metodo 'index', por isso não tá deletando ... sabe como resolver ?

DaniloAndrade 18 de mar. de 2013

altera isso

<form action="${pageContext.request.contextPath}/admin/menus/" method="post" id="formExcluirMenu">     
          <input type="hidden" value="delete" />   
          <input type="hidden" name="menu.id" id="idMenuExcluir" value=""/>    
          </form>

pra isso:

<form action="${pageContext.request.contextPath}/admin/menus/" method="post" id="formExcluirMenu">     
          <input type="hidden" name="_method" value="DELETE" />   
          <input type="hidden" name="menu.id" id="idMenuExcluir" value=""/>    
          </form>

Criado 18 de março de 2013

Ultima resposta 18 de mar. de 2013

Respostas 6

Participantes 3

6 Respostas

Topicos relacionados