locked
My bootstrap modal is not closing after pressing button why JQuery,Ajax,MVC? RRS feed

  • Question

  • User-199788946 posted

    Modal:

    <div class="modal fade" id="ResetUserModal" tabindex="-1" role="dialog" aria-labelledby="ResetUserModal" aria-hidden="true" data-backdrop="static">
        <div id="resetUserContainer">
        </div>
    </div>

    JQuery:

            function ResetUserSuccess(data) {
                debugger;
                if (data.success != true) {
                    return;
                }
                $('#ResetUserModal').modal('hide');
                $('#resetUserContainer').html("");
                userListVM.refresh();
                $.notify(data.message, {                
                    globalPosition: "top center",
                    className: "success"
                })
            }

    Controller code:

            [HttpPost, ActionName("Reset")]
            public async Task<ActionResult> ResetUser(string UserId)
            {
                var user = nicDBEntities.User_Table.FirstOrDefault(x => x.UserId == UserId);
                var pass = Membership.GeneratePassword(8, 1);
                HelperClass.SendMail(user.EmailAdd, pass);
                user.PassWd = HelperClass.Encrypt(pass);
                nicDBEntities.User_Table.Attach(user);
                nicDBEntities.Entry(user).State = EntityState.Modified;
                var task = nicDBEntities.SaveChangesAsync();
                await task;
                if (task.Exception != null)
                {
                    ModelState.AddModelError("", "Unable to Reset the Password");
                    Response.StatusCode = (int)HttpStatusCode.BadRequest;
                    User_TableVm userVM = MapToViewModel(user);
                    return View(Request.IsAjaxRequest() ? "_ResetPartial" : "Edit", userVM);
                }
    
                if (Request.IsAjaxRequest())
                {
                    return Json(new { success = true, message = "successfully reset" }, JsonRequestBehavior.AllowGet);
                }
    
                return RedirectToAction("ManageUser");
    
            }

    Ajax call From View

            <div class="modal-body">
                @using (Ajax.BeginForm("Reset", "User", null, new AjaxOptions { HttpMethod = "Post", OnSuccess = "ResetUserSuccess" }, new { @class = "form-horizontal", role = "form" }))
                {
                <div class="form-actions no-color">
                    @Html.HiddenFor(x => x.UserId)
                    <input type="submit" value="Reset" class="btn btn-warning" /> 
                    <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
                </div>
                }
            </div>

    The Json is returning true and the success message is receiving on  function ResetUserSuccess(data) and it is not executing 

       $('#ResetUserModal').modal('hide');
    

    It only show modal why?

    Saturday, May 23, 2020 1:46 PM

All replies

  • User1686398519 posted

    Hi,  jameslovemicrosoft

    You need to check if you have referenced the "jquery.unobtrusive-ajax.js" file so that Ajax.BeginForm will work well.

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

    Note: You can add jquery.unobtrusive-ajax through NuGet.

    Here is the result.

     
    Best Regards,

    YihuiSun

    Monday, May 25, 2020 5:17 AM