Ajax.BeginForm 提交点击无效,HTML.BeginForm returns 部分视图作为视图页面
Ajax.BeginForm on submit click not work and HTML.BeginForm returns partial view as view page
我有一个视图,其中有一个部分,部分中有一些 link;一节和一节link是这样的:
<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 时,此视图中的部分视图显示在 links 下。局部视图是这样的:
<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 提交按钮工作正常但在 return 部分,当我要加载第二个局部视图时,它被加载为视图!
问题: 我想要的是:当我点击提交按钮时 Ajax.BeginForm 或 HTML.beginForm 工作并且 returned 页面显示为部分视图而不是视图.
任何人都可以帮助我吗?
感谢 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>
我有一个视图,其中有一个部分,部分中有一些 link;一节和一节link是这样的:
<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 时,此视图中的部分视图显示在 links 下。局部视图是这样的:
<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 提交按钮工作正常但在 return 部分,当我要加载第二个局部视图时,它被加载为视图! 问题: 我想要的是:当我点击提交按钮时 Ajax.BeginForm 或 HTML.beginForm 工作并且 returned 页面显示为部分视图而不是视图. 任何人都可以帮助我吗?
感谢 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>