Tengo un formulario que me gustaría enviar (POST) cuando se llama a una función fuera del formulario y sin un botón (Funciona con un botón).
He intentado usar esto: document.getElementById('liked').submit();
Pero luego simplemente pega esto en la URL: http://localhost:3000/?postId=108&userId=1
Intenté poner method="post" en la etiqueta del formulario, pero luego dice "NO SE PUEDE PUBLICAR"
La publicación está hecha con Axios.
Además de eso, me gustaría que NO recargara la página/componente
Este es mi formulario:
<form id="liked" name="liked" onSubmit={handlePost}> <input hidden name="postId" id="postId" value={product.id} /> <input hidden name="userId" id="userId" value={currentUser.id} /> </form>;Esta es mi devolución de llamada que llama a la función de publicación de Axios:
const handlePost = useCallback((event) => { event.preventDefault(); context.postBookmark(event.target); });Aquí es donde me gustaría que se envíe el formulario:
const onSwipe = (direction) => { if (direction == "right") { // SUBMIT HERE document.getElementById("liked").submit(); } }Cuando llama al método de submit() del formulario, envía directamente el formulario.
No desencadena un evento de submit . No se llamará al controlador de envío. preventDefault no será llamado. context.postBookmark no será llamado.
Si desea llamar a context.postBookmark desde fuera del formulario, simplemente hágalo directamente sin iniciar un envío de formulario normal.
context.postBookmark(document.getElementById("liked"));Aparte: no se recomienda el acceso DOM directo con el uso de React. En su lugar, use una referencia o (mejor) almacene los datos en el estado y léalos desde allí).