Atualizar Div na alteração

Virtual Machine Man Membro desde: 26/05/2009 15:57:49 Mensagens: 707 Offline

Estou com um problema para efetuar a atualização de valores em uma div, la eu tenho alguns beans que imprimem o valor de uma classe porem toda alteração atualizo toda a pagina so para mostrar o novo valor, estou usando ajax para enviar os dados via post, uso servlet e jsp sem framework.

Desde ja obrigado

Poste o código para ficar mais fácil.

This message was edited 2 times. Last update was at 24/10/2010 22:25:56

Classe que cria os inputs

package com.ask.trata;

import java.util.Vector;
import org.joda.time.DateTime;

/**
 *
 * @author estagio.desenv
 */
public class Horarios {
    /*
     * @Classe de tratamento de horarios
     */

private static Vector<String> insereHr = new Vector<String>();
    private static Vector<Integer> insCod = new Vector<Integer>();
    private static Vector<Integer> insereQtd = new Vector<Integer>();
    private int cont = 0;
    private static String input = "";
    private int mes = new DateTime().getMonthOfYear();
    private int ano = new DateTime().getYear();
    private static String obs;
    private static String add = " ";

public String getAdd() {
        return add;
    }

public Horarios() {
    }
    //construtor - Verifica se horario ja não foi armazenado ou é zero e apos armazena ou nao

public Horarios(String hr, int cod, int qtd) {
        if (!insereHr.contains(hr)) {
            insCod.add(cod);
            insereHr.add(hr);
            insereQtd.add(qtd);
            add = "";
        } else {
            add = "<small><label style=\"font-family: Arial; font-weight: bold; color: rgb(204, 0, 0);\">"
                    + "  Valores inválidos ou já usados !</label></small>";
        }
    }
    //Deleta Horario

public static void delHorario(int cod) {

for (int x = 0; x < insereHr.size(); x++) {
            if (insCod.get(x) == cod) {
                insereHr.remove(x);
                insereQtd.remove(x);
                insCod.remove(x);
                break;
            }
        }
    }

//Contador para criar inputs
    public int getCont() {
        return cont;
    }

public void setCont(int cont) {
        this.cont = cont;
    }
    //gera input HTML

public String getInput() {

if (insereHr.size() > 0) {
            input = "<table style=\"font-weight: bold; font-size: small; color: rgb(29, 36, 198); font-family: Arial; width: 100%; text-align: left; margin-left: auto; margin-right: auto;\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">\n";
            for (int x = 0; x < insereHr.size(); x++) {

input += "<tr><td>";

input += "<a href=\"DelHorario?cod=" + insCod.get(x) + "\">[" + insCod.get(x) + "] </a>" + insereHr.get(x);

input += "<input style=\"height: 12px;\" type=\"text\" name=\"qtd" + cont + "\" value=\""
                        + insereQtd.get(x) + "\" size=\"1\" maxlength=\"2\" onchange=\"ajaxFunction(this.name)\""
                        + " onkeydown=\"if(isNaN(this.value)){this.value = ''}if(this.value<=0){this.value=''}\" "
                        + "onkeyup=\"if(isNaN(this.value)){this.value = ''}if(this.value<=0){this.value=''}\"><br></tr></td>";

cont++;
            }
            return input;
        } else {
            return "";
        }

}
    //Soma da quantidade de pessoas inseridas

public String getQtdTotal() {
        int value = 0;
        if (insereQtd.size() != 0) {
            for (int x = 0; x < insereQtd.size(); x++) {
                value += insereQtd.get(x);
            }
            if (value < 10) {
                return "0" + value;
            } else {
                return "" + value;
            }
        } else {
            return "00";
        }

}

public int getAno() {
        if (this.mes == 12) {
            return ano + 1;
        } else {
            return ano;
        }

}

public int getMes() {
        if (mes == 12) {
            return 01;
        } else {
            return mes + 1;
        }
    }

public static void clean() {
        insereHr.clear();
        insereQtd.clear();
        insCod.clear();
        obs = "";
        add = "";
    }

public String getObs() {
        return obs;
    }

public static void setObs(String obs) {
        Horarios.obs = obs;
    }
}

Servlet

package com.ask.servlet;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.ask.trata.Horarios;
import javax.servlet.RequestDispatcher;
import javax.swing.JOptionPane;

/**
 *
 * @author estagio.desenv
 */

/*
 * @Servlet para inclusão de input com o horario selecionado e a quantidade proposta
 */
public class IncluiHorarios extends HttpServlet {

@Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

try {

//Usa classe de horarios para tratar e armazenar
            String horario = request.getParameter("tempo");
            String hr = horario.substring(6,horario.length())+ "   ";
            int cod = Integer.parseInt(horario.substring(1,5));
            int qtd = Integer.parseInt(request.getParameter("qtd"));

if (!hr.equals("")) {
                Horarios hora = new Horarios(hr,cod,qtd);
            }

//   Reload na pagina simulador
            RequestDispatcher view = request.getRequestDispatcher("/servicos/simulador.jsp");
            view.forward(request, response);

} catch (Exception e) {
//            Caso nao consiga inserir horario e quantidade
            RequestDispatcher view = request.getRequestDispatcher("/servicos/simulador.jsp");
            view.forward(request, response);

}

}
}

JSP

<%-- 
    Document   : simulador
    Created on : 13/09/2010, 15:26:34
    Author     : estagio.desenv
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<jsp:useBean id="select" class="com.ask.dao.ComandosDao" />
<jsp:useBean id="hora" class="com.ask.trata.Horarios"/>
<jsp:useBean id="tab" class="com.ask.trata.TabHora"/>
<jsp:useBean id="dados" class="com.ask.trata.CriaSimulador"/>
<jsp:useBean id="us" class="com.ask.trata.usuario"/>

<html>
    <head>
        <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
        <title>ASK! Intranet</title>
    </head>
    <script src="js/Hora.js"></script>
    <body onload="data()" id="body">
    <style type="text/css">
        a:link {text-decoration: none; color: blue;}
        a:visited {text-decoration: none; color: blue;}
        a:hover {text-decoration: none; color: #006600;}
        a:active {text-decoration: none; color: blue;}
    </style>
    <script src="js/Valida.js"></script>
    <link type="text/css" rel="stylesheet" media="screen" href="css/simulador.css"/>
    <link type="text/css" href="css/botoes.css" rel="stylesheet" media="screen" />

<div id="ImprimirConteudo">
        <table style="width: 233px; height: 50px; text-align: center; margin-left: auto; margin-right: auto;" border="0" cellpadding="0" cellspacing="0">
            <tbody>
                <tr>
                    <td>
                        <img src="img/logo.JPG"><br><br>
                        <form name="form_relogio">
                            <input type="text" id="data" size="32" readonly>
                            <input type="text" id="relogio" size="7" readonly>
                        </form>
                    </td>
                </tr>
            </tbody>
        </table>
        <table style="width:700px; height: 80px; text-align: left; margin-left: auto; margin-right: auto;" border="1" cellpadding="0" cellspacing="1">
            <tbody>
                <tr style="font-family: Arial;">
                    <td style="height: 70px; text-align: center; vertical-align: middle;">
                        <small>
                            <span style="font-family: Arial; font-weight: bold;">${dados.infos}
                            </span>
                        </small>
                    </td>
                </tr>
            </tbody>
        </table>
        <table style="width: 700px; text-align: left; margin-left: auto; margin-right: auto;" border="1" cellpadding="2" cellspacing="2">
            <tbody>
                <tr>
                    <td style="width: 305px; text-align: center; font-family: Arial; font-weight: bold;">
                        <small>Propostade Horários</small>
                    </td>
                    <td style="width: 200px; text-align: center;">
                        <small><span style="font-weight: bold;"><span style="font-family: Arial;"><label>Nrº Ops. Intervalo</label></span></span></small>
                    </td>
                    <td style="width: 195px; text-align: center;">
                        <small><span style="font-weight: bold;"><span style="font-family: Arial;"><label>Dimensionamento/P.A's</label></span></span></small>
                    </td>
                </tr>
            </tbody>
        </table>
        <table style="width: 700px; height: 100px; text-align: left; margin-left: auto; margin-right: auto;" border="1" cellpadding="2" cellspacing="2">
            <tbody>
                <tr>
                    <td style="vertical-align: top; font-family: Arial; font-size: small;  font-weight: bold; color:#000000; text-align: center; height: 100px; width: 305px;">
                        ${hora.add}
                        <form method="post" action="IncluiHorarios" name="hora">
                            <br><b>
                                <label> Horário :</label>
                                <select name="tempo" title="Horário conforme legenda !" style="height: 20px;">
                                    <option>${select.select}</option>
                                </select>
                                <br><br><label>Quantidade :  </label><input style="height: 12px;" name="qtd" type="text" size="1" maxlength="2" title="Quantidade de P.A's no horário informado !" onchange="val(this.name)">   
                                <input name="insere" id="insere" value="Adicionar" type="submit">
                                <br>
                            </b>
                        </form>
                        <br>
                        <table>
                            <script src="js/AjaxTools.js"></script>
                            ${hora.input}
                        </table>
                        <br><br>
                       <div id="ct">
                        <table style="vertical-align: top; font-family: Arial; font-size: small;  font-weight: bold; color:#000000;">
                            <tbody>
                                <tr>
                                    <td>
                                        Folga :
                                    </td>
                                    <td>
                                        <input name="folga" value="00" size="1" style="height: 12px;" type="text" maxlength="2" onkeyup="val(this.name)">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Férias :
                                    </td>
                                    <td>
                                        <input name="ferias" value="00" size="1" style="height: 12px;" type="text" maxlength="2" onkeyup="val(this.name)">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Falta :
                                    </td>
                                    <td>
                                        <input name="falta" value="00" size="1" style="height: 12px;" type="text" maxlength="2" onkeyup="val(this.name)">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        SubTotal :
                                    </td>
                                    <td>
                                        <input name="subtotal" value="00" size="1" style="height: 12px;" type="text" readonly>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <br>
                                    </td>
                                </tr>

<tr>
                                    <td>
                                        Maternidade :
                                    </td>
                                    <td>
                                        <input name="maternidade" value="00" size="1" style="height: 12px;" type="text" maxlength="2" onkeyup="val(this.name)">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        INSS :
                                    </td>
                                    <td>
                                        <input name="inss" value="00" size="1" style="height: 12px;" type="text" maxlength="2" onkeyup="val(this.name)">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Total :
                                    </td>
                                    <td>
                                        <input name="total" value="${hora.qtdTotal}" size="1" style="height: 12px;" type="text" readonly>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Indice P.A. :
                                    </td>
                                    <td>
                                        <input name="indice" value="00%" size="1" style="height: 12px;" type="text" readonly>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                     </div>
                    </td>
                    <td style="width: 210px; text-align: left; vertical-align: top;">
                        <table style="width: 80%; text-align: center; margin-left: auto; margin-right: auto;">
                            <tr>
                                <td>
                                    ${tab.tabHora}
                                </td>
                            </tr>
                        </table>
                    </td>
                    <td style="width: 210px; text-align: left; vertical-align: top;">
                        <table style="width: 80%; text-align: center; margin-left: auto; margin-right: auto;">
                            <tr>
                                <td>
                                    ${tab.tabHora2}
                                    <br>
                                    <input id="cad" type="submit" name="atualiza" value="Atualizar" onclick="window.location.reload()">
                                </td>
                            </tr>
                        </table>
                </tr>
            </tbody>
        </table>
        <table style="width: 700px; height: 50px; text-align: left; margin-left: auto; margin-right: auto;" border="1" cellpadding="2" cellspacing="2">
            <tbody>
                <tr>
                    <td>
                        <small><label style="font-family: Arial; font-weight: bold;">Total de Operadores classificados por Horário :</label></small><br>
                        <br><small><label style="font-family: Arial;">${hora.qtdTotal} operdores de 36 Horas Semanais</label></small>
                    </td>
                </tr>
                <tr>
                    <td>
                        <small><label style="font-family: Arial; font-weight: bold;">Elaborador:  ${us.user}</label></small>
                        <br><br>
                        <small><label style="font-family: Arial; font-weight: bold;">Observações :</label></small><br>
                        <script src="js/AjaxTools.js"></script>
                        <textarea cols="80" rows="5" name="obs" title="Campo de observações !" onKeyDown="if(this.value.length >= 200){this.value = this.value.substring(0, 200)}" onKeyUp="if(this.value.length >= 200){this.value = this.value.substring(0, 200)}" onchange="ajaxPost(this.name)"></textarea>

</td>
                </tr>
            </tbody>
        </table>
    </div>
    <br>
    <table style="width: 700px; height: 50px; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="0" cellspacing="0">
        <tbody>

</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

<div id="ct">
                        <table style="vertical-align: top; font-family: Arial; font-size: small;  font-weight: bold; color:#000000;">
                            <tbody>
                                <tr>
                                    <td>
                                        Folga :
                                    </td>
                                    <td>
                                        <input name="folga" value="00" size="1" style="height: 12px;" type="text" maxlength="2" onkeyup="val(this.name)">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Férias :
                                    </td>
                                    <td>
                                        <input name="ferias" value="00" size="1" style="height: 12px;" type="text" maxlength="2" onkeyup="val(this.name)">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Falta :
                                    </td>
                                    <td>
                                        <input name="falta" value="00" size="1" style="height: 12px;" type="text" maxlength="2" onkeyup="val(this.name)">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        SubTotal :
                                    </td>
                                    <td>
                                        <input name="subtotal" value="00" size="1" style="height: 12px;" type="text" readonly>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <br>
                                    </td>
                                </tr>

<tr>
                                    <td>
                                        Maternidade :
                                    </td>
                                    <td>
                                        <input name="maternidade" value="00" size="1" style="height: 12px;" type="text" maxlength="2" onkeyup="val(this.name)">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        INSS :
                                    </td>
                                    <td>
                                        <input name="inss" value="00" size="1" style="height: 12px;" type="text" maxlength="2" onkeyup="val(this.name)">
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Total :
                                    </td>
                                    <td>
                                        <input name="total" value="${hora.qtdTotal}" size="1" style="height: 12px;" type="text" readonly>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Indice P.A. :
                                    </td>
                                    <td>
                                        <input name="indice" value="00%" size="1" style="height: 12px;" type="text" readonly>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                     </div>

Nessa div que eu quero atualizar os dados apos uma mudança nos inputs

Virtual Machine Man Membro desde: 26/05/2009 15:57:49 Mensagens: 707 Offline

consegui efetuar o reload pelo codigo

}

function ajaxQtd(nome){

var http = new getXMLObject();
    var valor = document.getElementsByName(nome)[0].value;
    if(!isNaN(valor)){
        var url = "AltQuantidades";
        var parameters = "nome="+nome+"&valor="+valor;

http.open("POST", url, true);

//Send the proper header information along with the request
        http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        http.setRequestHeader("Content-length", parameters .length);
        http.setRequestHeader("Connection", "close");

http.onreadystatechange = function(){

if( http.readyState == 4 && ( http.status == 200 ) ) {
                valor=http.responseText;
            }
        };
           $("#acumulador").load("servicos/simulador.jsp #acumulador") //parte da mesma página
        http.send(parameters);
    }else{
        alert('Use Somente Numeros');
        document.getElementsByName(nome)[0].value='';
    }

}

meu ajax com Jquery, no firefox ta lindo de ver mais no IE ele nao atualiza certo, atualiza 'quando quer', vi uns problemas de cache porem ja tentei de tudo para desabilitar e nada

Notícias, artigos e o maior fórum brasileiro sobre Java