hola de nuevo, voy a responderme a mi mismo y a publicar lo que he hecho hasta ahora con respecto a procesar dos formularios en una misma pagina con ajax. al final del codigo voy a preguntar una duda que tengo y espero por favor me ayuden y gracias de antemano.
codigo:
index.php:<head>
<script type="text/javascript" src="ajax.js"></script>
<title>Untitled Document</title>
</head>
<body>
<ul>
<li><a title="opcion1" href="javascript:Enviar('primeraopcion.php', 'contenido')">opcion1</a></li>
<li><a title="opcion2" href="javascript:Enviar('segundaopcion.php', 'contenido')">opcion2</a></li>
<li><a title="opcion3" href="javascript:Enviar('calcular.php', 'contenido')">Calcular</a></li>
</ul>
<div id="contenido"></div>
</body>
Calcular.php:<script type="text/javascript" src="ajax.js"></script>
<form name="form1" id="form1" method="post" enctype="multipart/form-data">
<table width="421" height="333" border="0" align="center">
<tr>
<td height="25" colspan="2">Introduzca el Tipo de producto:
<label>
<input type="text" name="tipo_producto" id="tipo_producto" value="<?php print $tipo_producto ?>">
</label></td>
</tr>
<tr>
<td height="25" colspan="2">Introduzca la Cantidad:
<label>
<input type="text" name="cantidad" id="cantidad" value="<?php print $cantidad ?>">
</label></td>
</tr>
<tr>
<td colspan="2">Seleccione el Color:
<label>
<select name="color" id="color">
<option selected value="0"></option>
<option value="1">Un color</option>
<option value="2">Dos colores</option>
<option value="3">Tres colores</option>
<option value="4">Full color</option>
</select>
<a title="Calcular" href="javascript:Cargarcontenido('mostrar.php', 'c=3', 'form1', 'contenido2')">Calcular</a>
</label></td>
</tr>
</table>
</form>
<br />
<div id="contenido2"></div>
Mostrar.php:<?php
include '../shared/class_folder/calcular_presupuesto.php';
?>
<form name="form2" id="form2" method="post" enctype="multipart/form-data">
<table width="390" height="154" border="0" align="center">
<tr>
<td height="27">Sutotal:
<label>
<input type="text" name="subtotal" value="<?php printf("%.2f",$subtotal); ?>">
</label></td>
</tr>
<tr>
<td height="30">total:
<label>
<input type="text" name="total" value="<?php printf("%.2f",$total); ?>">
</label></td>
</tr>
</table>
</form>
calcular_presupuesto.php:<?php
if($_REQUEST["c"]==3){
...aqui realizo los calculos... no los publico porq en realidad no hay nada que mostrar aqui (sumo, resto, multiplico y divido los resultados obtenidos en los input del calcular.php con otros datos que obtengo de una BD)
}
?>
ajax.js:function ajaxFunction() {
var xmlHttp;
try {
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
return xmlHttp;
} catch (e) {
// Internet Explorer
try {
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
return xmlHttp;
} catch (e) {
try {
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
return xmlHttp;
} catch (e) {
alert("Tu navegador no soporta AJAX!");
return false;
}}}
}
function Enviar(_pagina,capa) {
var ajax;
ajax = ajaxFunction();
ajax.open("POST", _pagina, true);
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.onreadystatechange = function()
{
if (ajax.readyState == 4)
{
if (ajax.status==200)
{
document.getElementById(capa).innerHTML = ajax.responseText;
}}}
ajax.send(null);
}
function Cargarcontenido(_pagina,seccion,formid,capa) {
var ajax;
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
.name+'='+encodeURI(Formulario.elements.value);
sepCampos="&";
}
ajax = ajaxFunction();
ajax.open("POST", _pagina, true);
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.onreadystatechange = function()
{
if (ajax.readyState==1)
{
document.getElementById(capa).innerHTML = "";
}
if (ajax.readyState == 4)
{
if (ajax.status==200)
{
document.getElementById(capa).innerHTML = ajax.responseText;
}}}
ajax.send(cadenaFormulario+"&"+seccion);
}
todo esto funciona; al hacer click en la opcion-menu calcular del index.php me carga el calcular.php en <div contenido>, introduzco mis datos y al darle click en calcular me carga en <div contenido2> el mostrar.php con los calculos correctos, todo esto sin recargar la pagina index.php (gracias a ajax).
mi problema surge cuando en el calcular.php deseo utilizar un checkbox para seleccionar el tipo de producto en lugar de escribirlo.
aparentemente la function Cargarcontenido() presente en ajax.js que es la que se encarga de obtener y procesar los datos del formulario (especificamente en el for) toma todos los checkbox como seleccionados (checked) asi no lo esten, y eso altera el resultado de mis calculos.
agradeceria cualquier ayuda por favor porq he indagado mucho y no encuentro informacion que me sirva.
gracias de antemano
