更改密码后更新部分视图

Question

在部分视图中更改密码后，我不知道如何留在同一页面。当我点击“提交”按钮，它将我带到另一个页面，我想留在同一页面，只显示一个消息，如“密码更改成功”我知道密钥是在

if (changePasswordSucceeded)
            {
                return RedirectToAction("ChangePasswordSuccess");


            }

我试过

return Json(true)

但我不知道如何处理刚刚更新页面的结果。

谢谢

更新： 主要观点

@model Points2Pay.Models.Usuario
@using Points2Pay.Extensions;

@{
    ViewBag.Title = @Resources.Points2pay.Usuario_Tools2;
    ViewBag.Head = @Resources.Points2pay.Usuario_Tools2;
}

<h2>@Resources.Points2pay.Usuario_Head4</h2>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>@Resources.Points2pay.Account_Text5</legend>

        @Html.HiddenFor(model => model.UsuarioId)
        @Html.HiddenFor(model => model.EmailAlterno)

        <div class="editor-label">
            @Html.LabelFor(model => model.Nombre) @Html.RequiredFieldFor(model => model.Nombre)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Nombre)
            @Html.ValidationMessageFor(model => model.Nombre)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Apellidos) @Html.RequiredFieldFor(model => model.Apellidos)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Apellidos)
            @Html.ValidationMessageFor(model => model.Apellidos)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Direccion) @Html.RequiredFieldFor(model => model.Direccion)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Direccion)
            @Html.ValidationMessageFor(model => model.Direccion)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Pais) @Html.RequiredFieldFor(model => model.Pais)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Pais)
            @Html.ValidationMessageFor(model => model.Pais)
        </div>

        @*<div class="editor-label">
            @Html.LabelFor(model => model.EmailAlterno)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.EmailAlterno)
            @Html.ValidationMessageFor(model => model.EmailAlterno)
        </div>*@

        <div class="editor-label">
            @Html.LabelFor(model => model.Telefono) @Html.RequiredFieldFor(model => model.Telefono)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Telefono)
            @Html.ValidationMessageFor(model => model.Telefono)
        </div>

@*        <div class="editor-label">
            @Html.LabelFor(model => model.FechaAlta)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.FechaAlta)
            @Html.ValidationMessageFor(model => model.FechaAlta)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Estatus)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Estatus)
            @Html.ValidationMessageFor(model => model.Estatus)
        </div>*@

@*        <div class="editor-label">
            @Html.LabelFor(model => model.Saldopublic)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Saldopublic)
            @Html.ValidationMessageFor(model => model.Saldopublic)
        </div>*@

@*        <br />
           @Html.ActionLink(@Resources.Points2pay.ChangePassword, "ChangePassword", "Account", new { id = Model.UsuarioId }, null)
           <br />*@
        <p>
            <input type="submit" value="@Resources.Points2pay.btn_Guardar" />
        </p>
    </fieldset> @Resources.Points2pay.CamposObligatorios <br />
}

<input type="submit" class="flip" value="@Resources.Points2pay.ChangePassword" />
<div class="panel">
@Html.Action("ChangePasswordPartial","Account")
</div>

<script type="text/javascript">
    $(document).ready(function () {
        $(".panel").hide();
        $(".flip").click(function () {
            $(".panel").slideToggle("slow");
        });
    });
</script>

部分视图

@model Points2Pay.Models.ChangePasswordModel

@{
    ViewBag.Title = Resources.Points2pay.ChangePassword;
    ViewBag.Head = Resources.Points2pay.ChangePassword;
}

<h2>@Resources.Points2pay.Account_Head1</h2>
<p>
    @Resources.Points2pay.Account_Text1 
</p>
<p>
    @Resources.Points2pay.Account_Text2 @Membership.MinRequiredPasswordLength @Resources.Points2pay.Account_Text3
</p>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true, @Resources.Points2pay.Account_Text4)
    <div>
        <fieldset>
            <legend>@Resources.Points2pay.Account_Text5</legend>

            <div class="editor-label">
                @Html.LabelFor(m => m.OldPassword)
            </div>
            <div class="editor-field">
                @Html.PasswordFor(m => m.OldPassword)
                @Html.ValidationMessageFor(m => m.OldPassword)
            </div>

            <div class="editor-label">
                @Html.LabelFor(m => m.NewPassword)
            </div>
            <div class="editor-field">
                @Html.PasswordFor(m => m.NewPassword)
                @Html.ValidationMessageFor(m => m.NewPassword)
            </div>

            <div class="editor-label">
                @Html.LabelFor(m => m.ConfirmPassword)
            </div>
            <div class="editor-field">
                @Html.PasswordFor(m => m.ConfirmPassword)
                @Html.ValidationMessageFor(m => m.ConfirmPassword)
            </div>

            <p>
                <input type="submit" value="@Resources.Points2pay.ChangePassword_Boton1" />
            </p>
        </fieldset>
    </div>
}
<script>
    $(document).ready(function () {
        $('form').submit(function (e) {
            $.ajax({
                url: $(this).action,
                type: 'POST', //I'm assuming this could be type GET.
                data: $(this).serialize,
                dataType: 'json',
                success: function (data) {
                    alert('ajax successfully');
                }
            });
            e.preventDefault();
        });
    });
</script>

CONTROLLER

[Authorize]
        [HttpPost]
        public ActionResult ChangePassword(ChangePasswordModel model)
        {
            if (ModelState.IsValid)
            {

                // ChangePassword will throw an exception rather
                // than return false in certain failure scenarios.
                bool changePasswordSucceeded;
                try
                {
                    MembershipUser currentUser = Membership.GetUser(User.Identity.Name, true /* userIsOnline */);
                    changePasswordSucceeded = currentUser.ChangePassword(model.OldPassword, model.NewPassword);
                }
                catch (Exception)
                {
                    changePasswordSucceeded = false;
                }

                if (changePasswordSucceeded)
                {
                    //return RedirectToAction("ChangePasswordSuccess");
                    return Json(true);


                }
                else
                {
                    ModelState.AddModelError("", Resources.Points2pay.Account_Error22);
                    //
                    //English
                    //ModelState.AddModelError("", "The current password is incorrect or the new password is invalid.");
                }
            }

            // If we got this far, something failed, redisplay form
            return View(model);
        }

Answer 1

如果您使用按钮提交类型，则需要避免浏览器的默认行为，换句话说，请阻止回发。要做到这一点，您需要使用ajax从客户端调用您的操作，捕获按钮的事件提交并发送数据。假设你正在使用像这样的jquery

<script type="text/javascript">
    $(document).ready(function(){
        $('.panel form').submit(function(e){
            $.ajax({
               url: $(this).action,
               type: 'POST' //I'm assuming this could be type GET.
               data: $(this).serialize,
               dataType: 'json',
               success: function(data){
                   alert('ajax successfully');
               }
            });
            e.preventDefault();
        });
    });
</script>

Answer 2

<div id="ShowResultHere"></div>

@using (Html.BeginForm("Update", "Test", FormMethod.Post, new { id="frmUpdate"}))
{
   //form fields
   <button type="submit" class="sprt bg_red bt_red h27">Update</button>
}

[HttpPost]
public ActionResult Update(TestModel model)
{
   return Json(new { s = "Success" });
}

$(function() {
    $('#frmUpdate').submit(function() {
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function(result) {
               // The AJAX call succeeded and the server returned a JSON 
               // with a property "s" => we can use this property
               // and set the html of the target div
               $('#ShowResultHere').html(result.s);
            }
        });
        // it is important to return false in order to 
        // cancel the default submission of the form
        // and perform the AJAX call
        return false;
    });
});