我試圖顯示一個模式,當用戶將鼠標懸停在視圖中的人員名稱上時,數據在部分視圖中呈現。我可以得到模態顯示,但沒有數據,並且由於要在視圖中顯示的名稱由linq語句生成,所以div都具有相同的類名稱。這會導致頁面上的所有名稱在懸停時顯示模型。我不知道如何解決這些問題。顯示模態中的部分視圖不拉數據
這裏是我迄今爲止...
jQuery來爲局部視圖
public ActionResult _AccountNumberModal(SearchViewModel viewModel, string id)
{
tblPeople people = db.tblPeoples.FirstOrDefault(x => x.PeopleCounterID.ToString() == id);
{
viewModel.FirstName = people.FirstName;
viewModel.LastName = people.LastName;
viewModel.AccountNumber = people.AccountNumber;
viewModel.AccountNumber2 = people.AccountNumber2;
viewModel.AccountNumber3 = people.AccountNumber3;
viewModel.AccountNumber4 = people.AccountNumber4;
viewModel.AccountClosed = people.AccountClosed;
viewModel.AccountClosed2 = people.AccountClosed2;
viewModel.AccountClosed3 = people.AccountClosed3;
viewModel.AccountClosed4 = people.AccountClosed4;
viewModel.AccountClosedDate1 = people.AccountClosedDate1;
viewModel.AccountClosedDate2 = people.AccountClosedDate2;
viewModel.AccountClosedDate3 = people.AccountClosedDate3;
viewModel.AccountClosedDate4 = people.AccountClosedDate4;
viewModel.TypeofAccount1 = people.TypeofAccount1;
viewModel.TypeofAccount2 = people.TypeofAccount2;
viewModel.TypeofAccount3 = people.TypeofAccount3;
viewModel.TypeofAccount4 = people.TypeofAccount4;
}
return View(viewModel);
}
創建和填充模式
$(document).ready(function (data) {
$('accountNumber').hover(function() {
var id = $(this).data("personID")
$(".modal").dialog({
autoOpen: true,
position: { my: "center", at: "center", of: parent },
width: 300,
resizable: false,
title: 'Accounts Information',
modal: true,
open: function() {
$(this).load('@Url.Action("_AccountNumberModal", "ICMS", ' + id + ')');
},
buttons: {
Ok: function() {
$(this).dialog("close");
}
}
});
return false;
});
});
控制器動作局部視圖
@model FHN.EIR.Web.Models.SearchViewModel
<section id="accountNumbers" class="sectionHeadingBold">Account Information</section>
@if (!string.IsNullOrEmpty(Model.AccountNumber))
{
<dl class="inline dl-rows">
<dt>
@Html.DisplayNameFor(model => model.AccountNumber)
</dt>
<dd>
@Html.DisplayFor(model => model.AccountNumber)
</dd>
<dt>
@Html.DisplayNameFor(model => model.TypeofAccount1)
</dt>
<dd class="width-275px">
@Html.DisplayFor(model => model.TypeofAccount1)
</dd>
<dt>
@Html.DisplayNameFor(model => model.AccountClosed)
</dt>
<dd class="width-dateField">
@if (Model.AccountClosed)
{
@Html.DisplayName("Closed")
}
else
{
@Html.DisplayName("Open")
}
</dd>
@if (Model.AccountClosed)
{
<dt>
@Html.DisplayNameFor(model => model.AccountClosedDate1)
</dt>
<dd>
@Html.DisplayFor(model => model.AccountClosedDate1)
</dd>
}
</dl>
<br />
if (!String.IsNullOrEmpty(Model.AccountNumber2))
{
<dl class="inline dl-rows">
<dt>
@Html.DisplayNameFor(model => model.AccountNumber2)
</dt>
<dd>
@Html.DisplayFor(model => model.AccountNumber2)
</dd>
<dt>
@Html.DisplayNameFor(model => model.TypeofAccount2)
</dt>
<dd class="width-250px">
@Html.DisplayFor(model => model.TypeofAccount2)
</dd>
<dt>
@Html.DisplayNameFor(model => model.AccountClosed2)
</dt>
<dd class="width-dateField">
@if (Model.AccountClosed2)
{
@Html.DisplayName("Closed")
}
else
{
@Html.DisplayName("Open")
}
</dd>
@if (Model.AccountClosed2)
{
<dt>
@Html.DisplayNameFor(model => model.AccountClosedDate2)
</dt>
<dd>
@Html.DisplayFor(model => model.AccountClosedDate2)
</dd>
}
</dl>
<br />
}
if (!String.IsNullOrEmpty(Model.AccountNumber3))
{
<dl class="inline dl-rows">
<dt>
@Html.DisplayNameFor(model => model.AccountNumber3)
</dt>
<dd>
@Html.DisplayFor(model => model.AccountNumber3)
</dd>
<dt>
@Html.DisplayNameFor(model => model.TypeofAccount3)
</dt>
<dd class="width-250px">
@Html.DisplayFor(model => model.TypeofAccount3)
</dd>
<dt>
@Html.DisplayNameFor(model => model.AccountClosed3)
</dt>
<dd class="width-dateField">
@if (Model.AccountClosed3)
{
@Html.DisplayName("Closed")
}
else
{
@Html.DisplayName("Open")
}
</dd>
@if (Model.AccountClosed3)
{
<dt>
@Html.DisplayNameFor(model => model.AccountClosedDate3)
</dt>
<dd>
@Html.DisplayFor(model => model.AccountClosedDate3)
</dd>
}
</dl>
<br />
}
if (!String.IsNullOrEmpty(Model.AccountNumber4))
{
<dl class="inline dl-rows">
<dt>
@Html.DisplayNameFor(model => model.AccountNumber4)
</dt>
<dd>
@Html.DisplayFor(model => model.AccountNumber4)
</dd>
<dt>
@Html.DisplayNameFor(model => model.TypeofAccount4)
</dt>
<dd class="width-250px">
@Html.DisplayFor(model => model.TypeofAccount4)
</dd>
<dt>
@Html.DisplayNameFor(model => model.AccountClosed4)
</dt>
<dd class="width-dateField">
@if (Model.AccountClosed4)
{
@Html.DisplayName("Closed")
}
else
{
@Html.DisplayName("Open")
}
</dd>
@if (Model.AccountClosed4)
{
<dt>
@Html.DisplayNameFor(model => model.AccountClosedDate4)
</dt>
<dd>
@Html.DisplayFor(model => model.AccountClosedDate4)
</dd>
}
</dl>
}
}
else
{
<dl class="inline dl-rows">
<dt>
<span class="mar-l-15px inline-messages">There are no accounts associated with this person</span>
</dt>
</dl>
}
UPDATE
我能得到的數據來填充。只是不確定如何製作,只有名字懸空才能打開相關模式,而不是所有名稱都打開模式?