No puedo obtener los valores de estos tres campos; solo devuelve un valor vacío (un espacio). Los id están configurados correctamente en el formulario.
<script> const data = { id: document.getElementById('idbook').value, name: document.getElementById('namebook').value, price: document.getElementById('pricebook').value }; function myFunction(){ const http = new easyHTTP; http.put('https://otg0gf6qw5.execute-api.us-east-2.amazonaws.com/books', data, function(err, post){ if(err) { console.log(err); } else { console.log(post); } }); </script> <!DOCTYPE html> <html> <body> <div class="container"> <form method="post" id="save" action="javascript:myFunction()"> <h1>Insert Book</h1> <div class="field"> <label for="id">ID Book:</label> <input type="text" id="idbook" name="id"/> <small></small> </div> <div class="field"> <label for="id">Name Book:</label> <input type="text" id="namebook" name="nameBook"/> <small></small> </div> <div class="field"> <label for="id">Price Book:</label> <input type="text" id="pricebook" name="priceBook"/> <small></small> </div> <div class="field"> <button type="submit" class="full">SAVE BOOK</button> </div> </form> </div>Cuando ingreso los valores y hago clic en GUARDAR, obtengo un json vacío, es decir:
{"id":"","name":"","price":""}
con error:
"Uno o más valores de parámetros no son válidos. El AttributeValue para un atributo clave no puede contener un valor de cadena vacío. Clave: id"
El problema es que obtiene los valores de los campos de entrada tan pronto como se ejecuta el script, por lo que obtendrá cadenas vacías porque las entradas en ese punto están vacías.
Para obtener los valores de entrada después de enviar el formulario, coloque la variable de datos dentro del método myFunction() , es importante leer los valores justo antes de enviar los datos.
<script> function myFunction() { const data = { id: document.getElementById('idbook').value, name: document.getElementById('namebook').value, price: document.getElementById('pricebook').value }; const http = new easyHTTP; http.put('https://otg0gf6qw5.execute-api.us-east-2.amazonaws.com/books', data, function(err, post) { if(err) { console.log(err); } else { console.log(post); } }); }; </script>No sé si esto es lo que quieres decir, pero dejé que los datos se guardaran en el registro de la consola cuando presionas enviar
<div class="container"> <form method="post" id="save" action="javascript:myFunction()"> <h1>Insert Book</h1> <div class="field"> <label for="id">ID Book:</label> <input type="text" id="idbook" name="id"/> <small></small> </div> <div class="field"> <label for="id">Name Book:</label> <input type="text" id="namebook" name="nameBook"/> <small></small> </div> <div class="field"> <label for="id">Price Book:</label> <input type="text" id="pricebook" name="priceBook"/> <small></small> </div> <div class="field"> <button type="submit" class="full">SAVE BOOK</button> </div> </form> <script> function myFunction(){ const data = { id: document.getElementById('idbook').value, name: document.getElementById('namebook').value, price: document.getElementById('pricebook').value }; console.log(data); } </script> </div></body></html>