我有一个按钮,在我的中定义如下索引.cshtml file:
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#myModal">
Add Value
</button>
单击按钮将打开一个模式窗口。我的模态定义在索引.cshtml文件如下:
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Add a Value</h4>
</div>
<div class="modal-body">
@(Html.Kendo().TabStrip()
.Name("tabstrip")
.Items(ts =>
{
ts.Add().Text("Pick a school").Selected(true).LoadContentFrom(Url.Action("SchoolPartial", "Institution"));
})
)
</div>
</div>
</div>
下面是我的部分的样子(SchoolPartial.cshtml):
<div class="col-md-12">
@(Html.Kendo().Editor()
.Name("schoolEditor")
.Tag("div")
.Tools(tools => tools
.Clear()
.Bold().Italic().Underline().Strikethrough()
.JustifyLeft().JustifyCenter().JustifyRight().JustifyFull()
.CreateLink().Unlink()
.InsertImage()
.TableEditing()
.FontColor().BackColor()
)
.Value(@<text><p>
<div class="container-fluid">
<div class="row">
<div class="col-md-4">Senior School</div>
</div>
</div>
</p></text>))
</div>
现在,用户点击“增值”Index.cshtml 文件中的按钮,'我的模态'窗口打开,然后在'我的模态'“选择学校”选项卡中的窗口,加载“学校部分”选项卡,我希望用户能够单击“高中”div。当用户点击高中 div 时SchoolPartial.cshtml, 我想id = 2传递给我的索引.cshtml,然后将从数据库加载学校名称和地址详细信息并将其显示在索引.cshtml.
我怎样才能实现这种行为。
Thanks!
EDIT:
在我的 SchoolPartial.cshtml 中,为了使我的 div 可点击,我用锚标记包围了我的 div,如下所示:
<a href="@Url.Action("RetrieveSchoolDetails", "School", new {schoolId= "2" })">
<div class="col-md-4">senior school</div>
</a>
这里学校是我的控制器(SchoolController.cs) 而 RetrieveSchoolDetails 是操作方法。
这就是我定义 RetrieveSchoolDetails 方法的方式:
public void RetrieveSchoolDetails (string schoolId= null)
{
var schoolDetail = db.School.Where(e => e.SchoolId== schoolId).ToList();
string Address = Convert.ToString(schoolDetail .Select(e => e.Address));
string Name = Convert.ToString(schoolDetail .Select(e => e.Name));
string School= Name + Address;
ViewBag.SchoolSelection = School;
}
现在我想要,一旦信息进入 ViewBag,我想关闭模式窗口,以便选择和 ViewBag 信息显示在 Index.cshtml 中。
我不确定如何从控制器关闭我的引导模式,以便它向我显示 Index.cshtml 中的数据。
或者可能只是向我显示模式,用户可以手动关闭模式,以便 ViewBag 信息仍然存在。当我运行我的项目时,为 ViewBag 赋值后,浏览器继续处理,我无法单击我的模式来关闭它。
请建议!
Thanks
EDIT 2:
我编辑了代码并使用 div click 来调用 javascript 函数,然后使用 ajax 调用控制器的方法 - RetrieveSchoolDetails 并从该控制器方法返回部分视图。
它现在所做的就是返回全屏显示学校地址的部分视图。即,它将我重定向到带有生成的学校地址的部分视图。
但是我想关闭模式,然后在我的父页面(Index.cshtml)内显示该部分视图。
以下是我添加的代码-
下面的div位于SchoolPartial.cshtml中
<div onclick="GetAddress('2')" class="col-md-4">senior school</div>
JavaScript 函数
<script>
function GetAddress(code)
{
$.ajax({
url: '/School/RetrieveSchoolDetails?schoolID=2',
contentType: 'application/html; charset=utf-8',
type: 'GET',
dataType: 'html'
})
.success(function (result) {
$('#npAddress').html(result); //npAddress is id of my div inside
//Index.cshtml where I want to display the partial.
//Here I want to close the modal window
//and show Index.cshtml in it's filled state.
})
.error(function (xhr, status) {
alert(status);
})
};
</script>
下面是我的控制器方法:
public void RetrieveSchoolDetails (string schoolId= null)
{
var schoolDetail = db.School.Where(e => e.SchoolId== schoolId).ToList();
string Address = Convert.ToString(schoolDetail .Select(e => e.Address));
string Name = Convert.ToString(schoolDetail .Select(e => e.Name));
string School= Name + Address;
ViewBag.SchoolSelection = School;
return PartialView("_schoolAddress");
}
下面是我的 _schoolAddress.chtml 部分
@ViewBag.SchoolSelection