Originalmente tengo un programa que me genera un html a partir de datos de Archivos planos.
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Pagina Principal de Compras</title>
<script>
function nuevoAjax()
{
var xmlhttp=false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}
function procesar_formulario(url, formid)
{
var Formulario=document.getElementById(formid);
var longitudFormulario=Formulario.elements.length;
var cadenaFormulario="";
var sepCampos;
sepCampos = "";
for(var i=0; i <= Formulario.elements.length-1;i++)
{
cadenaFormulario+= sepCampos+Formulario.elements[i].name+'='+encodeURI(Formulario.elements[i].value);
sepCampos="&";
}
alert(cadenaFormulario);
ajax=nuevoAjax();
//usamos el metodo Post - Archivo que realiza la actualizacion
ajax.open("post","../../cgi-bin/grabmodest.sh",true);
ajax.setRequestHeader('Content-Type', 'aplication/x-www-form-urlencoded; charset=ISO-8859-1');
ajax.send(cadenaFormulario);
ajax.onreadystatechange=function(){
if(ajax.readyState==4 && (ajax.status == 200 || window.location.href.indexOf ("http") == -1 || location.reload() ))
{
document.getElementById(mensaje).innerHTML = ajax.responseText;
}
}
}
</script>
</head>
<body>
<table width=725px border=1 cellspacing=0 cellpadding=2>
<div id="mensaje">
<form id="form001">
<tr>
<td>4428170</td>
<td>PRENSA EMBR."LUK"BAJA 1.5 75-DU-UNO-FIO.</td>
<td>Cajas</td>
<td><input name="unicaj" type="text" value="5" size="5" maxlength="5"></td>
<td>50</td>
<td>50</td>
<td>
<select name="estante" id="estante" onChange="procesar_formulario('alerta.php','form001');">
<option value=0 selected>UBICACION</option>
<option value=X41X>X41X</option>
</select>
</td>
<td><!-- Si estado = 0 muestro imagen1 o estado = 1 muestro imagen2 -->
<img src='img/imagen1.gif' alt='Sin Estanteria'>
</td>
<td><img src='img/camara.gif' border='0'></td>
</tr>
<input type="hidden" name="estado" value="0"> <!-- indica que no tiene estanteria por ende imagen es imagen1.gif -->
<input type="hidden" name="codigo" value="4428170">
<input type="hidden" name="cantidad" value="000050">
<input type="hidden" name="tipo" value="NP">
<input type="hidden" name="numero" value="00002548">
<input type="hidden" name="local" value="09">
<input type="hidden" name="wrecep" value="1">
<input type="hidden" name="prefix" value="@queule:/indra/dat">
<input type="hidden" name="servidor" value="queule">
<input type="hidden" name="empre" value="I">
<input type="hidden" name="logname" value="gherrera">
</form>
</div>
<div id="mensaje">
<form id="form002">
<tr>
<td>4428170</td>
<td>PRENSA EMBR."LUK"BAJA 1.5 75-DU-UNO-FIO.</td>
<td>Cajas</td>
<td><input name="unicaj" type="text" value="5" size="5" maxlength="5"></td>
<td>50</td>
<td>50</td>
<td>
<select name="estante" id="estante" onChange="procesar_formulario('alerta.php','form002');">
<option value=0 selected>UBICACION</option>
<option value=X41X>X41X</option>
</select>
</td>
<td><!-- Si estado = 0 muestro imagen1 o estado = 1 muestro imagen2 -->
<img src='img/imagen1.gif' alt='Sin Estanteria'>
</td>
<td><img src='img/camara.gif' border='0'></td>
</tr>
<input type="hidden" name="estado" value="0"> <!-- indica que no tiene estanteria por ende imagen es imagen1.gif -->
<input type="hidden" name="codigo" value="4428170">
<input type="hidden" name="cantidad" value="000050">
<input type="hidden" name="tipo" value="NP">
<input type="hidden" name="numero" value="00002548">
<input type="hidden" name="local" value="09">
<input type="hidden" name="wrecep" value="1">
<input type="hidden" name="prefix" value="@queule:/indra/dat">
<input type="hidden" name="servidor" value="queule">
<input type="hidden" name="empre" value="I">
<input type="hidden" name="logname" value="gherrera">
</form>
</div>
<div id="mensaje">
<form id="form003">
<tr>
<td>4428170</td>
<td>PRENSA EMBR."LUK"BAJA 1.5 75-DU-UNO-FIO.</td>
<td>Cajas</td>
<td><input name="unicaj" type="text" value="5" size="5" maxlength="5"></td>
<td>50</td>
<td>50</td>
<td>
<select name="estante" id="estante" onChange="procesar_formulario('alerta.php','form003');">
<option value=0 selected>UBICACION</option>
<option value=X41X>X41X</option>
</select>
</td>
<td><!-- Si estado = 0 muestro imagen1 o estado = 1 muestro imagen2 -->
<img src='img/imagen1.gif' alt='Sin Estanteria'>
</td>
<td><img src='img/camara.gif' border='0'></td>
</tr>
<input type="hidden" name="estado" value="0"> <!-- indica que no tiene estanteria por ende imagen es imagen1.gif -->
<input type="hidden" name="codigo" value="4428170">
<input type="hidden" name="cantidad" value="000050">
<input type="hidden" name="tipo" value="NP">
<input type="hidden" name="numero" value="00002548">
<input type="hidden" name="local" value="09">
<input type="hidden" name="wrecep" value="1">
<input type="hidden" name="prefix" value="@queule:/indra/dat">
<input type="hidden" name="servidor" value="queule">
<input type="hidden" name="empre" value="I">
<input type="hidden" name="logname" value="gherrera">
</form>
</div>
</table>
</body>
</html> Existe un <FORM> Por cada linea de datos, a cada linea debo asignarle una estanteria (estante) mediante el evento Onchange.
Los datos son capturados correctamente alert(cadenaFormulario).
Los datos son enviados via CGI a programa que me realiza las actualizaciones.
(cambiando la imagen1 x la imagen2); pero al obtener el resultado del DIV aun me muestra la imagen1 a pesar que se actualizaron los datos correctamente.
Por esta razon agrege un location.reload() que me actualiza la pagina; pero no es lo que necesito porque el tiempo de actualizacion dependera de la cantidad de datos mostrados desde la pagina principal y si son 1000 los que debo mostrar el tiempo de recarga se elevara.
Tengo forma de mostrar solamente el DIV actuualizado, con la imagen correspondiente.
Espero darme a entender, de ante mano Gracias.