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
bzy
Outubro 23, 2010, 3:45pm
#2
Poste o código para ficar mais fácil.
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>
<tr>
<td style="text-align: center">
<script src="js/Impressao.js"></script>
<input id="imp" type="button" name="imp" value="Imprime" onclick="Impressao(false);">
<input id="vimp" type="button" name="vimp" value="Visualiza Impressão" onclick="Impressao(true);">
<input id="save" type="button" name="save" value="Salvar">
<input id="return" type="button" name="return" value="Voltar" onclick="window.history.back()">
<p>
<form id="fim" method="post" action="Fim">
<input id="exit" type="submit" name="exit" value="Sair">
</form>
</td>
</tr>
</tbody>
</table>
</body>
</html>
[code]
Folga :
Férias :
Falta :
SubTotal :
<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>[/code]
Nessa div que eu quero atualizar os dados apos uma mudança nos inputs
consegui efetuar o reload pelo codigo
[code]function getXMLObject() {
var xmlHttp = false;
try {
xmlHttp = new ActiveXObject(“Msxml2.XMLHTTP”) // For Old Microsoft Browsers
}
catch (e) {
try {
xmlHttp = new ActiveXObject(“Microsoft.XMLHTTP”) // For Microsoft IE 6.0+
}
catch (e2) {
xmlHttp = false // No Browser accepts the XMLHTTP Object then false
}
}
if (!xmlHttp && typeof XMLHttpRequest != ‘undefined’) {
xmlHttp = new XMLHttpRequest(); //For Mozilla, Opera Browsers
}
return xmlHttp; // Mandatory Statement returning the ajax object created
}
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='';
}
}[/code]
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