Ajax.BeginForm上的提交点击不起作用,HTML.BeginForm返回部分视图作为视图页面

时间:2017-08-25 09:58:42

标签: asp.net-mvc validation asp.net-ajax partial-views unobtrusive-validation

我有一个视图,其中有一个部分,并在部分有一些链接;部分和一个链接是这样的:

<section id="tabs-section">
<ul id="myTab" class="my-nav nav nav-tabs  nav-justified responsive-tabs col-sm-12" style="padding:0;">
    <li class="active"><a href="#RegisterEditUsers" data-toggle="tab">A</a></li>
</ul>

<div class="tab-content col-sm-12" style="border:1px solid #000000;"@*margin-top:-20px;padding-top:20px;*@>
    <div class="tab-pane fade in active" id="RegisterEditUsers">@Html.Partial("RegisterEditUsers")</div>
        </div>

当我点击 A 时,此视图中的部分视图会显示在链接下方。局部视图是这样的:

<div class="panel" style="border:1px solid #ff6a00;margin:10px 10px 0 
10px;padding:10px;">
<div class="row ">
        <div id="register" class="col-sm-6 col-sm-offset-0 col-sm-pull-0 
col-sm-push-6 col-xs-offset-3 col-xs-pull-1 btn btn-circle ">
            @Ajax.ActionLink("AA", "Register", "Account", new AjaxOptions { 
HttpMethod = "Get", UpdateTargetId = "Result", InsertionMode = 
InsertionMode.Replace, OnComplete = "regClick" })
        </div>

        <div id="edit" class="col-sm-6 col-sm-offset-3 col-xs-offset-0 btn 
btn-circle">
            @Ajax.ActionLink("BB", "GetUsers", "UsersAdmin", new AjaxOptions 
{ HttpMethod = "Get", UpdateTargetId = "Result", InsertionMode = 
InsertionMode.Replace, OnComplete = "edClick" })
        </div>
    </div>
</div>
<div class="panel" style="border:1px solid #ff6a00;margin:0px 10px 10px 
10px;">
<div id="Result" dir="rtl"></div>
</div>

最后当我选择 AA 时,会在前部分视图旁边加载一个新的局部视图,即:

    @using (Ajax.BeginForm(
    "Register", 
    "Account", 
    null, 
    new AjaxOptions
{
    HttpMethod = "Post",
    UpdateTargetId = "IdentifyPerson",
    InsertionMode = InsertionMode.Replace
  }))
  {
    @Html.AntiForgeryToken();
    @Html.ValidationSummary(true, "", new { @class = "text-danger" });

    <div id="IdentifyPerson" style="padding:10px">
        <div class="panel" style="padding:10px; direction:rtl">

            <div class="row">
                <div class="form-group col-md-2">
                    <label class="sr-only" for="LastName">:</label>
                    @*<input type="text" class="form-control" id="LastName" 
placeholder="" name="LastName">*@
                    @Html.TextBoxFor(c => c.LastName, new { @class = "form-
control", placeholder = "" })
                    @Html.ValidationMessageFor(model => model.LastName, "", 
new { @class = "text-danger" })
                </div>
            </div>
            <div class="row">
                <div class="pull-left">
                    <button type="submit" id="RegisterBtn" 
name="RegisterBtn" class="btn btn-info" style="padding:10px">AAA</button>
                </div>
            </div>
        </div>
    </div>
 }

一切顺利,直到我点击提交按钮( AAA ),什么也没发生。我也在我的网页中使用这一行:

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

如果我使用 HTML.BeginForm 而不是 Ajax.BeginForm 提交按钮工作正常,但在返回部分,当我想加载第二个局部视图时,它被加载作为一个观点!! 问题:我想要的是:当我点击提交按钮Ajax.BeginForm或HTML.beginForm工作并返回页面显示为部分视图而不是视图。 任何人都可以帮助我吗?

1 个答案:

答案 0 :(得分:0)

感谢Stephen Muecke,看来捆绑不能正常工作。我不知道为什么真的,我只是将这四行直接添加到局部视图中并且工作正常:)

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