我正在使用带有Razor2的ASP MVC4。我试图使用Javascript来检索JSON数据并选择我想要显示的属性。每个线程都有自己的JSON文件,我一次显示15个线程。我无法一次性获取数据,这会减慢页面加载时间。所以我认为客户端会很好,因为它不是敏感数据。
这是我的代码:
public static PagedList<PiFDetailsModel> GetPagedThreads(int skip, int take)
{
using (var context = new PiFDbDataContext())
{
// refactor consideration...make this a pre-compiled query
var threads = context.Threads
.OrderBy(c => c.CreatedDate).Skip(skip).Take(take).ToList();
var threadsCount = threads.Count();
var details = new List<PiFDetailsModel>();
foreach (Thread thread in threads)
{
var model = new PiFDetailsModel();
var games = new List<Game>();
// Make this AJAX instead.
string text;
try
{
text = Utilities.GetThreadInfo(thread.ThingID)[0].data.children[0].data.selftext_html;
text = text.Replace("\n\n", "<br /><br />").Replace("\n", "<br />");
}
catch
{
// TODO Handle exceptions better.
text = "Reddit is currently down or too busy, cannot retrieve information at this time";
}
foreach (ThreadGame game in thread.ThreadGames)
{
if (games.Any(x => x.Name == game.Game.Name))
{
games.Find(x => x.Name == game.Game.Name).Count += 1;
}
else
{
var simpleGame = game.Game;
simpleGame.Count = 1;
games.Add(simpleGame);
}
}
model.Games = games;
model.GameCount = thread.ThreadGames.Count;
model.ThreadTitle = thread.Title;
model.Username = thread.User.Username;
model.CreatedDate = thread.CreatedDate;
model.ThreadID = thread.ThingID;
// model.SelfText = new HtmlString(text);
details.Add(model);
}
return new PagedList<PiFDetailsModel>
{
Entities = details,
HasNext = skip + 10 < threadsCount,
HasPrevious = skip > 0
};
}
}
[OutputCache(Duration = 60 * 5)]
public static dynamic GetThreadInfo(string thingID)
{
string uri = string.Format("http://www.reddit.com/{0}/.json", thingID);
var connect = WebRequest.Create(new Uri(uri)) as HttpWebRequest;
connect.UserAgent = "r/playitforward site by /u/sevenalive";
// Do the actual connection
WebResponse response = connect.GetResponse();
string resp;
using (var reader = new StreamReader(response.GetResponseStream()))
{
resp = reader.ReadToEnd();
}
return new JavaScriptSerializer().Deserialize<dynamic>(resp);
}
指数:
@foreach (var item in Model)
{
<div class="pif">
<div class="left">
<div class="title"><a href="/PiF/@item.ThreadID">@item.ThreadTitle</a></div>
<div class="description">
<div class="expandable">
<p>@item.SelfText</p>
</div>
</div>
<div class="createdTime">
<strong>@Html.TimeAgo(@item.CreatedDate)</strong>
</div>
<div class="createdBy">
@if (item.Games.Count() == 1)
{
@item.Games.Single().Name
}
else
{
<text>@item.GameCount games</text>
}
being given by <a href="@string.Format("http://reddit.com/u/{0}", item.Username)">@item.Username</a>
</div>
</div>
<div class="left">
<ul class="games">
@foreach (var game in item.Games)
{
<li>
<a href="@game.StoreUrl" title="@game.Name">@game.Name</a> <span style="color:#b5b8be; font-weight:600">@string.Format("({0}P)", game.PointWorth)</span>
@if (game.Count > 1)
{
<span style="color:#b5b8be; font-weight:600">(@game.Count copies)</span>
}
</li>
}
</ul>
</div>
<div class="clearBoth"></div>
</div>
}
我尝试了一些搜索,但我找不到任何我想要的例子。我认为javascript,可能是JQuery,将是最好的方式。我是网络开发的新手,所以一个详细的例子将受到高度赞赏。整个代码库是开源的,我可以使用帮助,所以如果你想请叉! https://github.com/sevenalive/PlayItForward
答案 0 :(得分:0)
function GetSelfText(thingId) {
$.getJSON("http://www.reddit.com/r/playitforward/comments/" + thingId + "/.json?jsonp=?", { id: thingId }, function (data) {
var tempHtml = $('<div/>').html(data[0].data.children[0].data.selftext_html).text();
$("#selfText-" + thingId).html(tempHtml);
})
}
<div class="description" id="selfText-@item.ThreadID">
<script type="text/javascript">
$(document).ready(function () { GetSelfText('@item.ThreadID'); });
</script>
</div>