4

我正在开发使用 Razor 视图引擎和 Jquery 的 ASP.Net MVC 3 网站

在主页（或与此相关的任何页面）上，我想使用ajax加载部分内容，例如 iGoogle。

我的意思是在页面加载时

  • 我想调用一些 HttpGet 操作方法，每个方法都返回一些 Html 内容

  • 在我得到响应之前，这些 Div 显示“正在加载”图形。

我知道 Ajax.BeginForm 和 Ajax.ActionLink 但在这两种情况下我都需要单击一些 UI 元素；我不知道如何在页面加载/文档中使用它们。准备好了吗？

即使我得到一些指导而不是确切/完整的代码，我也会很感激。

4

1 回答 1

9

好的，让我们给你一些指导，我将在 jquery 中展示一些代码，因为它很简单。我们走吧。

html

<div id="SomeContent"> </div>

在你看来

$(function(){ // this runs on on page load
    LoadData('#SomeContent', @Url.Action("ActionName","ControllerName"));
});

在 javascript 库文件中

function LoadData(target, url){
  $.ajax({  
   beforeSend: startAnimation(target),
   url : url,
   success : function(result){ $(target).html(result); },
   complete  : stopAnimation(target)   
});
}

function startAnimation(target){
  //..add a loading image on top of the target  
}

function stopAnimation(target){
  // remove the animation gif or stop the spinning, etc.
}

你的服务器端代码

public ActionResult ActionName() {
    ... do things to get your model populated ...
    return PartialView("SomeView", yourmodel);
}

额外的想法：

  • 这个粗略的代码将部分视图加载到 div 中。当 dom 准备好时，异步调用开始。
  • 有关 jquery ajax 文档，请参阅http://api.jquery.com/jQuery.ajax/
  • 我喜欢使用 spin.js 来显示加载图标，因为它非常简单和小巧。
于 2013-07-01T03:52:29.780 回答