los datos de input creados con javascript no se envian por el form a la nueva pagina

[julslash]

Saludos tengo un problema con java script y php
hice un codigo para agregar input tantos como quiera con un boton!
pero ahora me presenta el siquiente problema

Tengo un boton para buscar productos una vez encontrado el producto le doy click agregar y este me lo agrega automaticamente en el campo name="nombreproduc'+nextinput+ con atributo disabled="disabled" por esa razon me cree otro campo invisible name="nombreproducinvisible'+nextinput+'" y lo hace perfecto. hasta ese punto todo bien!
la funcion AgregarCampos() se llama tantas veces quiera agregar un producto y crea el campo automaticamente para de nuevo buscar el producto y agregarlo en ese nuevo input.

Esto lo estoy haciendo para crear presupuestos tengo q añadir otros campos pero estoy haciendo primero lo basico para ver q funcione bien

El problema es que cuando he agregado varios productos y pulso en el boton de enviar a la nueva pagina para mostrar el presupuesto los valores q muestra son NULL
no entiendo por que no los toma
los datos de input creados con javascript no se envian por el form a la nueva pagina
lo hago de la siguiente manera luego haria un contador para q tome todos sin especificar el nombre de la variable 0,1,2

Código PHP:

  esto es lo que esta en reporte3.php 
 
 
$nombreproducinvisible0 = $_POST['nombreproducinvisible0']; 
$nombreproducinvisible1 = $_POST['nombreproducinvisible1']; 
 
 
echo gettype($nombreproducinvisible0); 
echo "</br>"; 
echo $nombreproducinvisible0; 
echo "</br>"; 
echo gettype($nombreproducinvisible1); 
echo "</br>"; 
echo $nombreproducinvisible1; 
echo "</br>";  
   

Este es el script

Código HTML:

<script type="text/javascript">
var nextinput = 0;
var cuenta = 1;

function AgregarCampos(){
if(confirm("\u00bfSeguro desea agregar un nuevo producto?")) {
nextinput++;
cuenta++;
campo = '<input type="hidden" id="'+nextinput+'" size="10" value="'+nextinput+'"/><div id="divideaviso2"><h4 style="color:#FF7800; padding-left:10px;">Producto '+cuenta+' </h4><table width="700" border="0"><tr><td colspan="5">Nombre del producto seleccionado:</td></tr><tr><td colspan="5"><label for="textfield2"></label><input type="text" name="nombreproduc'+nextinput+'" id="nombreproduc'+nextinput+'" size="110" disabled="disabled" /><br><input type="hidden" name="nombreproducinvisible'+nextinput+'" id="nombreproducinvisible'+nextinput+'" size="110" /></td></tr></table></br></div>';

$("#campos").append(campo);
}
}
</script>

Este es el codigo de la pagina donde se agregan los input que quiera el usuario

Código HTML:

 <form id="form2" name="form2" method="post"  action="pages/presupuesto/reporte3.php" target='_new'>

<!------------------------------- Aqui se crean Nuevos campos ----------------------------->

 <div id="campos">
 
 </div>
 
<!------------------------------- Fin Nuevos campos ----------------------------->
 
 
 <a href="#" onclick="AgregarCampos();">Agregar nuevo producto</a>

    

 <input name="Guardar" type="submit" value="Generar Presupuesto" />
	 
  
 </form> 

[ocp001a]

Quizá me equivoque, pero el problema es que estás creando nuevos elementos por "fuerza bruta" es decir inyectando html dentro de un html ya creado, cuando deberías agregar los campos al formulario mediante dom, es decir agregando nuevos hijos al formulario.