转载自品路图书馆：http://www.pinlue.com/article/2020/03/0707/559989802342.html
在ASP.NET MVC中使用Juqery实现页面局部刷新
自己做的一个实验，留作备忘，此实例包括扩一下几个文件：1、MyMovieController.cs2、Index.aspx3、ViewUserControl1.ascx4、movie类其中MyMovieController.cs不用再说了，代码如下
MyMovieController.csusing System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.Mvc;using System.Web.Mvc.Ajax;namespace MyMVC.Controllers{public class MYMovieController : Controller{ GET: /MYMovie/public ActionResult Index(){return View();}public ActionResult Search(string query, int? page){List<movie> movies = movie.Movies.Where(r => r.MovieName.Contains(query)).OrderByDescending(r => r.MovieName).Skip((page ?? 0) * 4).Take(4).ToList();if (Request.IsAjaxRequest()){int moiveCount=movie.Movies.Where(r => r.MovieName.Contains(query)).Count();ViewData["totalPage"] = (int)Math.Ceiling(moiveCount / 4d);ViewData["query"] = query;return View("ViewUserControl1", movies);}else{return View();}}}}
movie.csusing System;using System.Collections.Generic;using System.Linq;using System.Web;namespace MyMVC{public class movie{public string MovieName { get; set; }public string Category { get; set; }public movie(string movieName, string category){this.MovieName = movieName;this.Category = category;}public static List<movie> Movies{get{return new List<movie>{new movie("龙行天下","动作片"),new movie("虎胆龙威","动作片"),new movie("龙虎门","动作片"),new movie("猛龙过江","动作片"),new movie("龙的传人","动作片"),new movie("龙之战","动作片"),new movie("铁甲威龙","动作片"),new movie("见龙卸甲","动作片")};}}}}
ViewUserControl1.ascx<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<IEnumerable<MyMVC.movie>>" %><table><thead><tr><th>MovieName</th><th>Category</th></tr></thead><tbody><% foreach (var item in Model) { %><tr><td><%= Html.Encode(item.MovieName) %></td><td><%= Html.Encode(item.Category) %></td></tr><% } %></tbody></table><p><%int totalPage = (int)ViewData["totalPage"];string query = ViewData["query"].ToString();for (var i = 0; i < totalPage; i++){%><a href="#" title="<%=i %>"><%= Html.Encode(i+1) %></a><%}%></p>
Index.aspx<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"><title>Index</title><style type="text/css">#result table thead tr{background-color:#cccccc;}</style><script src="../../Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script><script type="text/javascript">//发送异步请求，将结果输出到<div id="result"></div>中//最后一个参数可以是"html"也可以是"text"function search(query, page){$.post("/MYMovie/Search", "query=" + query + "&page=" + page, function(data){$("#result").html(data);$("#result table tbody tr:odd").css("background", "#F5DEB3");}, "text");//屏蔽超级链接跳转return false;}$(function(){//为搜索按钮绑定事件$("#search").click(function(){search($("#query").val());})//为新生成的分页连接绑定click事件$("a").live("click", function(){search($("#query").val(), $(this).attr("title"));});})</script></head><body><div><h2>搜索电影</h2><%= Html.TextBox("query") %><input type="button" id="search" value="提交" /><div id="result"></div></div></body></html>
6321
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
