伙计我正在尝试在我的测试网络应用程序上生成通知以学习MVC。这个功能与facebook的新闻源相同。我创建了一个通知模型,一个部分通知视图,并在控制器中执行存储过程以从数据库中检索值(SQL Server 2012)。
现在我要做的是,在加载页面时,它应该显示3个通知(部分视图重复3次,每次使用不同的值),然后在滚动事件上它应该再加载5个通知..
这是我的模特:
public class Notice
{
public string Subject { get; set; }
public DateTime Date { get; set; }
public string Department { get; set; }
public string Body { get; set; }
public string NoticeImage { get; set; }
public string Icon { get; set; }
}
这是我的部分观点:
<article class="feed payroll new" data-slide="items1">
<div class="sideicon"><img src="@Model.notice.Icon" alt="payroll" width="52" height="52"></div>
<section>
<header>
<h3> @Model.notice.Subject</h3>
<p><span> @Model.notice.Department</span> | @Model.notice.Date </p>
</header>
<article>
@Model.notice.Body
<br />
<img src="@Model.notice.NoticeImage" width="100" height="100"/>
</article>
</section>
</article>
这是我的控制者:
Query = "uSP_GetNotices";
cmd = new SqlCommand(Query, Connection);
cmd.CommandType = CommandType.StoredProcedure;
DataTable dtNotice = new DataTable();
Connection.Open();
dtNotice.Load(cmd.ExecuteReader());
Connection.Close();
Notice objNotice = new Notice();
objNotice.Subject = dtNotice.Rows[0]["Subject"].ToString();
objNotice.Date = Convert.ToDateTime(dtNotice.Rows[0]["IssueDate"]);
objNotice.Department = dtNotice.Rows[0]["Department"].ToString();
objNotice.Body = dtNotice.Rows[0]["Body"].ToString();
objNotice.NoticeImage = dtNotice.Rows[0]["NoticeImage"].ToString();
objNotice.Icon = dtNotice.Rows[0]["Icon"].ToString();
//returning Main view....
现在我该如何获得该功能?如何每次使用不同的值多次重复部分视图?
在上面的代码中,我只输入数据表的第0行来建模...我想动态地这样做,即改变每个局部视图的行数。我真的很感激一些帮助。
编辑: NoticeUserWrapper
public class NoticeUserWrapper
{
public User user;
public List<Notice> noticeList;
public NoticeCount noticeC;
public NoticeUserWrapper()
{
user = new User();
noticeList = new List<Notice>();
noticeC = new NoticeCount();
}
}
答案 0 :(得分:1)
将List传递给主视图,然后循环调用Html.RenderPartial
,如下所示:
@model List<NameSpace.Models.Notice>
@forach(var item in Model)
{
Html.RenderPartial("YourPartialView", item)
}
部分视图
@model NameSpace.Models.Notice
<article class="feed payroll new" data-slide="items1">
<div class="sideicon"><img src="@Model.notice.Icon" alt="payroll" width="52" height="52"></div>
<section>
<header>
<h3> @Model.notice.Subject</h3>
<p><span> @Model.notice.Department</span> | @Model.notice.Date </p>
</header>
<article>
@Model.notice.Body
<br />
<img src="@Model.notice.NoticeImage" width="100" height="100"/>
</article>
</section>
</article>
你需要使用jquery和ajax来实现这一点,我在我的一个项目中实现了这个,并制作了一个你可以在这里看到的教程:
http://developmentpassion.blogspot.com/2013/12/infinite-scroll-paging-in-aspnet-mvc-4.html
答案 1 :(得分:1)
你可以使用ajax:
//you method on the controller
public ActionResult GetNotice(Param param)
{
//retrive notice
IList<Notice> viewModels = GetNotices();
return PartialView("_NoticePartial",viewModels)
}
JavaScript的:
$(document).ready(function()
{
//ID of your div
$("#mynotices").scroll(function() {
var param = "your param";
$.post("/Notice/GetNotice",{param: param}, function(data) {
$("mynotices").append(data);//append all notice retrieved from your controller
});
});
});
部分视图
@model IList<Notice>
@foreach(item in Model)
{
<article class="feed payroll new" data-slide="items1">
<div class="sideicon"><img src="@Model.notice.Icon" alt="payroll" width="52" height="52"></div>
<section>
<header>
<h3> @item.notice.Subject</h3>
<p><span> @item.notice.Department</span> | @item.notice.Date </p>
</header>
<article>
@item.notice.Body
<br />
<img src="@item.notice.NoticeImage" width="100" height="100"/>
</article>
</section>
</article>
}
索引页:
<div id="mynotices">
//your notice
</div>