如何为 Ajax.BeginForm MVC 刷新和重定向脚本

Posted 2023-04-13

【中文标题】如何为 Ajax.BeginForm MVC 刷新和重定向脚本

【英文标题】：how make a script refresh and redirecting for Ajax.BeginForm MVC

【发布时间】：2019-06-01 08:03:52

【问题描述】：

我使用Ajax.BeginForm创建了一个表单

@using (Ajax.BeginForm("CreatePlayer", "Admin", null, new AjaxOptions()  HttpMethod = "post" ))

<div class="row">
    <div class="col-md-6">

        <div class="text-style-roboto form-group">
            <label>Имя</label>
            @html.TextBoxFor(x => x.Name, new  @class = "form-control" )
            @Html.ValidationMessageFor(m => m.Name)
        </div>

        <div class="form-group">
            <button type="submit" class="button button-create">Добавить</button>
        </div>
    </div>
</div>

当我按下按钮创建一个新播放器时，会创建一个播放器，但表单保持填充状态。

,

期望的行为是应该清除表单，但事实并非如此。我不知道如何使用 jQuery 清除表单。我应该刷新页面还是其他方式。

我在控制器中的发布操作是 -

[HttpPost]
    public JsonResult CreatePlayer(CreatePlayerModel model, string TeamNameId)
    
        if (ModelState.IsValid)
        
            if (TeamNameId != string.Empty)
            
                try
                
                    int newTeamId = int.Parse(TeamNameId);
                    repository.CreatePlayer(model, newTeamId);
                    TempData["message"] = string.Format("Игрок 0 1 сохранены", model.Name, model.Surname);

                    return new JsonResult()
                    
                        JsonRequestBehavior = JsonRequestBehavior.AllowGet,
                        Data = new  result = "success" 
                    ;
                
                catch (Exception exc)
                
                    Console.WriteLine(exc.Message);
                
            
        
        IEnumerable<SelectListItem> list = new SelectList(repository.Teams, "Id ", "Name");
        ViewBag.ChoosingTeam = list;
        return new JsonResult()
        
            JsonRequestBehavior = JsonRequestBehavior.AllowGet,
            Data = new  result = "error" 
        ;
    

如果需要，我可以通过 html 表单对 Ajax 执行操作。

【参考方案1】：

如果您使用的是 AJAX，表单不会自动清除，您需要清除它。您可以将输入文本和文本区域的值设置为''。此外，您需要重置选择的值。

假设form id 为CreatePlayer 那么将输入文本和textarea 的值设置为空白（''） -

$('#CreatePlayer').find("input[type=text], textarea").val('');

同样，您可以将 select 的值设置为您选择的默认值。假设第一个选项要重置的select，并且select的id是teamSel，那么要重置值-

$("#teamSel").val($("#teamSel option:first").val());

如果您在表单中添加了重置按钮，则可以触发重置，但不会将默认值设置为表单输入。触发重置 -

$("#CreatePlayer").trigger('reset');

__ 更新 ___

您应该在OnSuccess 和/或OnFailure 中调用这些（取决于您的要求）。

当 AJAX 调用成功返回时，您应该清除表单。也就是说，在OnSuccess 中，清除表单。

如果调用OnFailure，您应该会显示错误。

【讨论】：

需要在 aajaxOptions 中通过 onSuccess 调用或在 html 属性中提交的函数中制作？

@Andrei 很高兴我能帮上忙。如果您能接受作为答案，将不胜感激:)