Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

244
Vistas
cómo enviar un formulario usando JS sin perder la página

Necesito enviar un formulario normal usando el código myform.submit(); pero al mismo tiempo no quiero que vuelva a cargar la página.

para hacer eso, usé en el formulario mismo onsubmit="return false;" además de eso, también utilicé para el formulario EventListener este fragmento de código e.preventDefault(); . y utilicé para el lado del servidor central de asp.net un tipo de return Json(rslt); , aunque siempre pierdo mi página y obtengo una página vacía con el valor Json(rslt) = 1

¿Echo de menos algo aquí?

HTML

 <form id="cloneFile" onsubmit="return false;" asp-action="postFile" asp-controller="Rooms" method="post" enctype="multipart/form-data"> some html </form>

JAVASCRIPT

 var myform = document.getElementById('cloneFile'); function somefun (){ .... bla bla bla myform.submit(); } myform.addEventListener("submit", function (e) { e.preventDefault(); var frm = e.target; var ClonedFrm = frm.cloneNode(true); ClonedFrm.removeAttribute("id"); var frmData = new FormData(ClonedFrm); var Url = e.target.action; fetch (Url, {method: "POST", body: frmData}) { ... bla bla bla }) return false; });

Núcleo Asp.Net

 [HttpPost] public IActionResult postFile([FromForm] SubjectFile fileData) { int rslt = 0; if (ModelState.IsValid) { fileData.Id = Guid.NewGuid(); _context.Add(fileData); rslt = _context.SaveChanges(); } return Json(rslt); }
about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

Te has perdido el último signo ">" en la primera línea de la etiqueta del formulario.

De lo contrario, este código funciona bien en mi extremo.

about 4 years ago · Juan Pablo Isaza Denunciar

0

Esto funciona cuando permite que el formulario se envíe a través de HTML (haciendo clic en el botón Enviar o mediante el teclado).

 var myform = document.getElementById('cloneFile'); myform.addEventListener("submit", function(e) { e.preventDefault(); console.log('submit') });
 <form id="cloneFile" method="post"> <label>test: <input type="text" /></label> <button type="submit">Submit</button> </form>

Sin embargo, si intenta enviar el formulario mediante programación a través de HTMLFormElement.submit() ...

no se genera ningún evento de envío. En particular, el controlador de eventos onsubmit del formulario no se ejecuta.

Por lo tanto, no se evita el comportamiento predeterminado del formulario.

Si necesita enviar el formulario mediante programación por algún motivo, en su lugar puede usar HTMLFormElement.requestSubmit() , que actúa como si se hubiera hecho clic en el botón de envío del formulario.

 var myform = document.getElementById('cloneFile'); myform.addEventListener("submit", function(e) { e.preventDefault(); console.log('submit') }); function somefun(){ myform.requestSubmit(); } somefun()
 <form id="cloneFile" method="post"> <label>test: <input type="text" /></label> </form>

Nota: HTMLFormElement.requestSubmit() no es compatible con Internet Explorer o Safari

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda