mercoledì 13 giugno 2012

Lista con checkbox paginata (display table 1.1)

Nel post precedente ho utilizzato la versione di display table 1.2, che ha un decorator apposito per  la gestione delle checkbox.
Sulla 1.1 (dove dovevo lavorare) non era però disponibile tale decorator e allora mi sono dovuto un pò arrangiare per avere la stessa funzionalità.
Praticamente nel decorator che crea il checkbox ho aggiunto un javascript che effettua una chiamata ajax all'onclick dell'utente, trasmettendo l'id dell'oggetto e specificando se è stato selezionato o deselezionato.
La servlet richiamata si occupa quindi di controaggiornare i dati della lista in sessione.
Quindi paginando avanti e indietro, dato che la display table si aggancia sempre alla lista dati in sessione, trovo i dati aggiornati.
Non è il massimo da un punto di vista di performance.

Di seguito il codice

DECORATOR (per creare il check sulla lista)

package it.decorator;
import it.servlet.Nazione;
import javax.servlet.jsp.PageContext;
import org.displaytag.decorator.TableDecorator;
import org.displaytag.model.TableModel;
public class MyDecorator extends TableDecorator {
   
     public void init(PageContext pageContext, Object decorated, TableModel tableModel)
        {
         super.init(pageContext, decorated, tableModel);

        }

       public String getNome(){
         
        Nazione nazione=(Nazione)getCurrentRowObject();
        return "<a href=\"dettaglio.jsp?nazione="+nazione.getNome()+"\">"+nazione.getNome()+"</a>";
    }
    public String getChecked(){
        StringBuffer sb=new StringBuffer();
        Nazione nazione=(Nazione)getCurrentRowObject();
        if(nazione.isCheched()){
        sb.append("<input type=\"checkbox\" name=\"idChk\" value=\""+nazione.getId()+" \" id=\""+nazione.getId()+"\" onclick=\"chiamaServlet('"+ nazione.getId() +"')\" checked />");
        //    sb.append("<input type=\"hidden\" name=\"idChkHid\"  value=\"++ />");
        }
        else
        {
            sb.append("<input type=\"checkbox\" name=\"idChk\" id=\""+nazione.getId()+"\" onclick=\"chiamaServlet('"+ nazione.getId() +"')\" value=\""+nazione.getId()+" \" />");
        }
        return sb.toString();
    }
 
}

SERVLET (richiamata via Ajax per aggiornare il check in sessione)

......

String id=request.getParameter("id");
boolean checked=request.getParameter("param").equals("1")?true:false;
List<Nazione> listaNazioni=(List<Nazione>)request.getSession().getAttribute("LISTA_DATI");
for(Nazione n:listaNazioni){
              if(String.valueOf(n.getId()).equals(id.trim())){
                n.setCheched(checked);
                break;
                 }
                  }
request.getSession().setAttribute("LISTA_DATI",listaNazioni);

.....

SERVLET (richiamata alla pressione del bottone per visionare quanto selezionato)


......

PrintWriter pw=response.getWriter();
List<Nazione> lista=(List<Nazione>)request.getSession().getAttribute("LISTA_DATI");
int i=0;
pw.println("<br>");
for(Nazione n:lista){
            if(n.isCheched()){
                if(i==0) {
                    pw.println("<b>ELEMENTI SELEZIONATI</b>");
                    pw.println("<br>");
                }
               
                pw.println(n.getNome());
                pw.println("<br>");
                i++;
            }
           
            }
pw.flush();

.....



JSP (con il js per le chiamate ajax)

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<script>
function getXMLHttpRequest() {
    try {

    return new XMLHttpRequest();
    } catch (e) {
    try {

    return new ActiveXObject('Microsoft.XMLHTTP');
    } catch (e) {
    try {
    return new ActiveXObject('MSXML2.XMLHTTP.3.0');
    } catch(e) {alert('errore');}
    }
    }
    return null;
    }
    function stampaSelezionati(){
        var xmlHttp=getXMLHttpRequest();
        xmlHttp.onreadystatechange=function (){
            if(xmlHttp.readyState==4){
            if(xmlHttp.status==200 || xmlHttp.status==0){
             var risultatoTxt=xmlHttp.responseText;
         
             var elem=document.getElementById("divRisultati");
             elem.innerHTML="";
            
             elem.innerHTML=risultatoTxt;
            }
            else
            {
            alert('Comunicazione fallita '+xmlHttp.status+" Motivo: "+xmlHttp.statusText);
            }
            }
            };
            xmlHttp.open("POST","StampaSelezionate",true);
            xmlHttp.setRequestHeader("content-type", "application/x-www-form-urlencoded");
            xmlHttp.setRequestHeader("connection", "close");
            xmlHttp.send(null);
    }
function chiamaServlet( id){
    var xmlHttp=getXMLHttpRequest();
    var miaCheck=document.getElementById(id);
   
    var param=0;
    if(miaCheck.checked){
        param=1;
    }
    xmlHttp.onreadystatechange=function (){
    if(xmlHttp.readyState==4){
    if(!(xmlHttp.status==200 || xmlHttp.status==0)){
    alert('Comunicazione fallita '+xmlHttp.status+" Motivo: "+xmlHttp.statusText);
    }
    }
    };
    xmlHttp.open("POST","GetSelection",true);
    xmlHttp.setRequestHeader("content-type", "application/x-www-form-urlencoded");
    xmlHttp.setRequestHeader("connection", "close");
    xmlHttp.send("id="+document.getElementById(id).value+"&param="+param);
    }

</script>
<%@ taglib uri="http://displaytag.sf.net" prefix="display" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
 <!--  String numPag=request.getParameter("d-49653-p")==null?"1":request.getParameter("d-49653-p");
   session.setAttribute("numPag", numPag);
   requestURI="${pageContext.request.contextPath}/GetSelection"
 -->
 <jsp:include page="version.jsp"></jsp:include>
<body>
<form name="formTest" action="">
<display:table name="${LISTA_DATI}" class="dataTable"  decorator="it.decorator.MyDecorator" pagesize="5">
<display:column property="checked"></display:column>
<display:column property="nome"></display:column>
<display:column property="continente"></display:column>
<display:column property="abitanti"></display:column>
<display:column property="ranking"></display:column>
</display:table>
<input type="hidden" name="prova"  id="test" value="test"/>

<input type="button" name="btnInvio2" id="btnInvio2" value="Invio" onclick="stampaSelezionati()" >
<div id="divRisultati">

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


Nessun commento:

Posta un commento