locked
Ajax.BeginForm is Showing a Page Refresh RRS feed

  • Question

  • User206383436 posted

    I have a view with an Ajax.BeginForm

    @using (Ajax.BeginForm("Update", "Catalogs",
                new AjaxOptions
                {
                    HttpMethod = "POST",
                    OnSuccess = "OnSuccess",
                    OnFailure = "OnFailure",
                }))
    {
        @Html.LabelFor(m => m.VDirImagenesArt)
        @Html.TextBoxFor(m => m.Id, new { id = "txtId", @class = "datInvisible" })
        @Html.EJ().Button("btnActualizar").Width("250").Height("38").Text("ACTUALIZAR").ClientSideEvents(e => e.Click("OnClickClear")).Type(ButtonType.Submit)
    }

    The action that performs the HttpGet and displays the view and its content is: 

    public ActionResult Parametros()
    {
         ParametroRepository objParametroRepository = new ParametroRepository();
         List<Parametro> parametros = objParametroRepository.BuscarTodo(ref mensaje).ToList();
         return View(parametros[0]);
    }

    The Update action triggered by the submit button is as follows:

    [HttpPost]
    public ActionResult Update(Parametro parametro) 
    {
    ParametroRepository objParametroRepository = new ParametroRepository();
    objParametroRepository.Modificar(parametro, ref mensaje);
    return View("Parametros"); }

    I am experiencing a visible screen refresh when clicking the Submit button that runs the Update action, but it is supposed that an Ajax form should update without refreshing the page. I tried a return Json(parametro), but I got a new page showing only the results in Json format. I also tested public void Update(Parametro parametro) and a blank page was displayed. How can I avoid a page refresh, and stay in the same page/view?

    Regards,

    Jorge Maldonado  

    Thursday, February 7, 2019 12:38 AM

Answers

  • User1520731567 posted

    Hi JORGEMAL,

    How can I avoid a page refresh, and stay in the same page/view?

    You have to include jquery.unobtrusive-ajax.js file in your view to make Ajax.BeginForm to work.

    To work Ajax.BeginForm functionality properly don't forget to add the reference of the following jQuery library as below:

    <script src="~/Scripts/jquery-1.10.2.js"></script>    
    <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script> 

    Best Regards.

    Yuki Tao

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, February 7, 2019 7:01 AM

All replies

  • User1520731567 posted

    Hi JORGEMAL,

    How can I avoid a page refresh, and stay in the same page/view?

    You have to include jquery.unobtrusive-ajax.js file in your view to make Ajax.BeginForm to work.

    To work Ajax.BeginForm functionality properly don't forget to add the reference of the following jQuery library as below:

    <script src="~/Scripts/jquery-1.10.2.js"></script>    
    <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script> 

    Best Regards.

    Yuki Tao

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, February 7, 2019 7:01 AM
  • User206383436 posted

    Thanks. I also had to set the following setting in web.config to true:

    <appSettings>
      ...
      <add key="UnobtrusiveJavaScriptEnabled" value="false" />
    </appSettings>
    Monday, February 18, 2019 2:43 PM