Question

即使使用不显眼的ajax库，在提交表单时也会加载从_Login.cshtml文件加载到此页面的脚本，我不知道如何防止这种情况。更奇怪的效果是当onclick事件应用于任何元素时，当提交表单时，脚本将被单击元素的次数执行。

修改在进一步测试时，我意识到不显眼的ajax库基本上会在UpdateTargetId元素中重新加载整个页面，这非常适得其反。这意味着如果我提交页面4次，则页面随后会加载到页面中每个页面上的每个UpdateTargetId元素中。我究竟做错了什么？这是它应该做的吗？

    @using MinervaMvc.App_Data
    @model MinervaMvc.Models.LogOnModel
    @{
        ViewBag.Title = "Home Page";
        Layout = "~/Views/Shared/_Login.cshtml";

    }
    <div id="loginContainer">
<h2>
    Login</h2>
<div id="loginForm">
    @{Html.EnableClientValidation();}
    @using (Ajax.BeginForm(new AjaxOptions { HttpMethod = "POST" }))
      { 
        <table style="margin: 0px auto;">
            <tr>
                <td>
                    @Html.LabelFor(m => m.ServerName, new { @class = "label" })
                </td>
                <td>
                    @Html.TextBoxFor(m => m.ServerName, new { @class = "text" })
                </td>
            </tr>
            <tr>
                <td align='right'>
                    @Html.LabelFor(m => m.UserName, new { @class = "label" })
                </td>
                <td>
                    @Html.TextBoxFor(m => m.UserName, new { @class = "text" })
                </td>
            </tr>
            <tr>
                <td align='right'>
                    @Html.LabelFor(m => m.Password, new { @class = "label" })
                </td>
                <td>
                    @Html.PasswordFor(m => m.Password, new { @class = "text" })
                </td>
            </tr>
            <tr>
                <td align="right" colspan="2">
                    <div id='errorShade' class='shade'>
                        <div id='errorBox'>Password or Username is incorrect. Please try again.</div>
                    </div>
                </td>
            </tr>
            <tr>
                <td align="right" colspan="2">
                    <div id='loginShade' class='shade'>
                        <input type='submit' class='button' id='btn' value='Login' /></div>
                </td>
            </tr>
        </table>
           <div id='ajaxUpdate' style='position: absolute; visibility: hidden;'>
                @{if (ViewBag.Failed != null && ViewBag.Failed)
                {
                    <script type="text/javascript">
                    pulseState.stopPluse = true;
                    hideShowLogin(true, 'errorShade', 20);
                    hideShowLogin(false, 'loginShade', 33);
                    </script>
                }}
            </div>
      }
</div>
    </div>
    <br />
    <div id="copywrite">
        @{ Html.RenderPartial("Copyright"); }
    </div>

Answer 1

首先，您不需要以下行：

@{Html.EnableClientValidation();}

只需在web.config中启用客户端验证（默认情况下应该是这样）：

<appSettings>
    <add key="UnobtrusiveJavaScriptEnabled" value="true"/>
    <add key="ClientValidationEnabled" value="true"/>
</appSettings>

然后确保您已将以下脚本包含在您的页面中：

的jquery-1.5.1.js
jquery.validate.js
jquery.validate.unobtrusive.js
jquery.unobtrusive-ajax.js（这适用于所有Ajax.*帮助程序，它与验证无关）

就整个页面重新加载而言，当您在AJAX选项中指定UpdateTargetId元素时，此元素将使用服务器返回的AJAX请求的结果进行更新（通常是部分）。 / p>

MVC3 Razor脚本重新加载问题，即使是不引人注目的

1 个答案: