Tengo un formulario de pedidos con varios input y quiero enviar el valor de todos estos input a un servlet a través de jQuery Ajax hacia un servlet. Mi problema es que la cantidad de estos input es variable, es decir, el usuario es libre de aumentar más pedidos(input) por tanto debería enviar un arreglo con el valor de dichos input. Pero no tengo idea de cómo hacerlo.
Aquí les dejo mi código.
function getInput(type, placeholder,clase,name){
var nodo = document.createElement("input");
nodo.type = type;
nodo.placeholder = placeholder;
nodo.className = clase;
nodo.name = name;
nodo.required ="";
return nodo;
}
function append(className, nodoToAppend){
var nodo = document.getElementsByClassName(className)[0];
nodo.appendChild(nodoToAppend);
}
function agregaCaja(){
var nodo = getInput("number","el precio","precio","precio");
append("formulario",nodo);
}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
</head>
<body>
<form >
<div class="formulario">
<input type="number" placeholder="precio" class="precio">
</div>
<br>
<input type="submit" id="btnregistrar" value="enviar">
<input type="button" value="agregar" onclick="agregaCaja()">
</form>
</body>
<script>
$(document).ready(function(){
$("#btnregistrar").click(function(){
var subTotal = $(".precio");
$.get("/LuanTextilesProyecto/prueba",{"subTotal[]":[subTotal[0].value,subTotal[1].value]}, function(data, status){
alert("Data: " + data + "\nStatus: " + status);
});
});
});
</script>
</html>
parte del codigo del servlet prueba
try{
String[] subtotal = request.getParameterValues("subTotal[]");
out.println("<h3>subtotal :"+subtotal[0]+"</h3>");
}
catch(Exception e){
out.println("<h1> el pedido no se pudo registrar</h1>");
}