无法显示带有 asp.net mvc url.action 链接的引导对话框
Posted
技术标签:
【中文标题】无法显示带有 asp.net mvc url.action 链接的引导对话框【英文标题】:Cannot display bootstrap dialog with an asp.net mvc url.action link 【发布时间】:2015-03-22 00:10:42 【问题描述】:在能够显示带有 url 操作链接的模式对话框方面,我显然遗漏了一些东西。
我知道如何从 jQuery 点击事件中显示引导对话框,但我希望做的是:
我有一个带有 url.action 链接的索引页面。当用户单击链接时,我链接到适当的控制器操作方法(编辑),没有问题(在调试期间看到),希望显示引导模式弹出对话框。但是,没有弹出模式对话框。
如果我在操作链接上包含数据目标,则该链接甚至不起作用。如果我删除它,它会进入视图,但不会弹出模式对话框,因为链接上没有任何内容说明数据目标是什么。我希望我在模式弹出目标的链接上的语法不正确。我希望如果我为对话框包含正确的引导属性,它会弹出。
我真的可以在这里得到一些帮助,我们将不胜感激。
这是我的索引页面上的链接(包括数据目标)。再次注意,如果我从下面的代码 sn-p 中排除“数据切换”和“数据目标”,我会进入视图,但会弹出 no 对话框起来。
data-toggle="modal", data-target="#categoryEditModal"
<a href="@Url.Action("Edit", "Category", new area = "Categories", id = item.CategoryID ) data-toggle="modal", data-target="#categoryEditModal"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span>Edit</a>
这是我的目的地视图。我可以验证在调试时,Model.CategoryID 和 Model.CategoryDescription 已填充到模型中。
<div class="modal" id="categoryEditModal" tabindex="-1" role="dialog" aria-labelledby="categoryModal-label" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="categoryModal-label">Category Description</h4>
</div>
<div class="modal-body">
<div class="form-group">
@html.ValidationSummary(true, "", new @class = "text-danger" )
<div class="form-group">
@Html.LabelFor(model => model.CategoryDescription, htmlAttributes: new @class = "control-label required col-md-2 col-sm-2 col-xs-2" )
<div class="col-md-10">
@Html.EditorFor(model => model.CategoryDescription, new htmlAttributes = new @class = "form-control" )
@Html.ValidationMessageFor(model => model.CategoryDescription, "", new @class = "text-danger" )
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary" id="btnSaveCategory">Save</button>
</div>
</div>
</div>
</div>
在索引页面上编辑代码以弹出对话框
<a href="@Url.Action("Edit", "Category", new area="Categories", id = item.CategoryID )"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span>Edit</a>
【问题讨论】:
使用jquery返回部分视图并打开modal。 【参考方案1】:在你看来有
<a href="@Url.Action("Edit", "Category", new area = "Categories", id = item.CategoryID ) data-toggle="modal", data-target="#categoryEditModal" data-modal=""><span class="glyphicon glyphicon-edit" aria-hidden="true"></span>Edit</a>
<div id='myModal' class='modal fade in'>
<div class="modal-dialog">
<div class="modal-content">
<div id='myModalContent'></div>
</div>
</div>
</div>
添加jquery:
$(function ()
$.ajaxSetup( cache: false );
$("a[data-modal]").on("click", function (e)
$('#myModalContent').load(this.href, function ()
$('#myModal').modal(
/*backdrop: 'static',*/
keyboard: true
, 'show');
);
return false;
);
);
并在您的控制器中返回部分视图:
Return PartialView("partialviewname")
【讨论】:
Rick,很棒的技术,但如果我简单地省略了索引页面上的引导类,我就能够使用我原来的技术打开对话框。以上是关于无法显示带有 asp.net mvc url.action 链接的引导对话框的主要内容,如果未能解决你的问题,请参考以下文章
ASP.NET MVC - 使用带有匿名类型和 Jquery 的 JavaScriptStringEncode()
实体框架探查器 - 带有 EF 6 的 ASP.NET MVC4 - 无法确定提供程序名称