Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

250
Views
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 answers
Answer question

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 Report

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 Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!