I'm trying to do exactly what is in the documentation about DataGrid
I drag the components and drop into p:droppable
, but nothing happens, it gives a revert and does not create the table as in the documentation example.
My Bean:
package escola.musica.bean;
import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;
import javax.faces.bean.ManagedBean;
import javax.faces.context.FacesContext;
import org.primefaces.event.DragDropEvent;
import org.primefaces.model.DefaultStreamedContent;
import org.primefaces.model.StreamedContent;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Controller;
import escola.musica.dao.GenericDao;
import escola.musica.modelo.Aluno;
import escola.musica.modelo.Matricula;
import escola.musica.servico.MatriculaServico;
@Controller("turmaBean")
@Scope("session")
@ManagedBean
public class TurmaBean implements Serializable{
private static final long serialVersionUID = 5759339104756147807L;
private List<Matricula> matriculas;
private List<Matricula> matriculasInseridas = new ArrayList<Matricula>();
@Autowired
private MatriculaServico matriculaServico;
public void iniciarBean()
{
matriculas = matriculaServico.listarTodos();
}
public StreamedContent getImagemAluno()
{
Map<String, String> mapaParametro = FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap();
String idAluno = mapaParametro.get("id_aluno");
if(idAluno != null)
{
Aluno alunoBanco = new GenericDao<Aluno>(Aluno.class).obterPorId(new Integer(idAluno));
return alunoBanco.getImagem();
}
return new DefaultStreamedContent();
}
public void onMatriculaDrop(DragDropEvent event)
{
Matricula matricula = (Matricula) event.getData();
matriculas.remove(matricula);
matriculasInseridas.add(matricula);
}
//os gets e sets ....
My View
<ui:composition
template="/pages/layout/template.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<link type="text/css" rel="stylesheet" href="#{request.contextPath}/resources/css/style.css" />
<ui:define name="titulo">- Turmas</ui:define>
<ui:define name="header">
<script type="text/javascript">
function handleDrop(event, ui) {
var droppedCar = ui.draggable;
droppedCar.fadeOut('fast');
}
</script>
</ui:define>
<ui:define name="principal">
<h:form id="turma_form">
<p:fieldset legend="Alunos Matrículados">
<p:dataGrid id="alunos-matriculados" value="#{turmaBean.matriculas}" var="matricula" columns="3">
<p:panel id="painel-matriculas" header="#{matricula.aluno.nome}">
<h:panelGrid columns="2">
<p:graphicImage value="#{turmaBean.imagemAluno}" cache="false" rendered="#{matricula.aluno.foto != null}" styleClass="size-img">
<f:param name="id_aluno" value="#{matricula.aluno.id}" />
</p:graphicImage>
<h:outputText value="Sem foto" rendered="#{matricula.aluno.foto == null}" />
<h:panelGrid columns="2">
<h:outputText value="Matrícula:"/>
<h:outputText value="#{matricula.numero}"/>
<h:outputText value="Curso:"/>
<h:outputText value="#{matricula.curso.nome}"/>
</h:panelGrid>
</h:panelGrid>
</p:panel>
<p:draggable for="painel-matriculas" revert="true" handle=".ui-panel-titlebar" stack=".ui-panel"/>
</p:dataGrid>
</p:fieldset>
<p:fieldset legend="Turma de Teoria - 1º ano">
<p:outputPanel id="drop-area">
<h:outputText value="Arraste a matricula e solte aqui!" rendered="#{empty turmaBean.matriculasInseridas}"/>
<p:dataTable value="#{turmaBean.matriculasInseridas}" var="matricula" rendered="#{not empty turmaBean.matriculasInseridas}">
<p:column headerText="Número">
<h:outputText value="#{matricula.numero}"/>
</p:column>
<p:column headerText="Aluno">
<h:outputText value="#{matricula.aluno.nome}"/>
</p:column>
<p:column headerText="Curso">
<h:outputText value="#{matricula.curso.nome}"/>
</p:column>
</p:dataTable>
</p:outputPanel>
</p:fieldset>
<p:droppable for="drop-area" datasource="alunos-matriculados" onDrop="handleDrop" tolerance="touch" activeStyleClass="ui-state-highlight">
<p:ajax listener="#{turmaBean.onMatriculaDrop}" update="drop-area alunos-matriculados"/>
</p:droppable>
</h:form>
</ui:define>
</ui:composition>
Another detail in activeStyleClass="ui-state-highlight"
should be triggered when I drag the component by changing% color%, which is not happening. I'm guessing it has something to do with that dataTable
up there.