您好,欢迎访问一九零五行业门户网

MVC Ajax Helper或Jquery异步加载部分视图_jquery

废话不多说了,直接给大家贴代码了。
model:
namespace mvcapplication1.models{ public class team { public string preletter { get; set; } public string name { get; set; } }}
通过jquery异步加载部分视图
home/index.cshtml视图中:
@{ viewbag.title = index; layout = ~/views/shared/_layout.cshtml;}index 通过jquery异步
@section scripts{ }
homecontroller控制器中:
using system.collections.generic;using system.linq;using system.web.mvc;using mvcapplication1.models;namespace mvcapplication1.controllers{ public class homecontroller : controller { public actionresult index() { return view(); } [httppost] public actionresult index(string pre) { var result = getallteams().where(t => t.preletter == pre).tolist(); viewbag.msg = 通过jquery异步方式到达这里~~; return partialview(teamy, result); } private list getallteams() { return new list() { new team(){name = 巴西队, preletter = b}, new team(){name = 克罗地亚队, preletter = k}, new team(){name = 巴拉圭, preletter = b}, new team(){name = 韩国, preletter = k} }; } }}
部分视图teamy.cshtml:
@model ienumerable @{ var result = string.empty; foreach (var item in model) { result += item.name + ,; }}@viewbag.msg.tostring()
@result.substring(0,result.length - 1)
通过mvc ajax helper异步加载部分视图
home/index.cshtml视图中需要引用jquery.unobtrusive-ajax.js文件,从控制器返回的强类型部分视图内容呈现到updatetargetid指定的div中。
@{ viewbag.title = index; layout = ~/views/shared/_layout.cshtml;}index @ajax.actionlink(通过mvc ajax helper,load,home, new {pre = k}, new ajaxoptions(){updatetargetid = result1})

homecontroller控制器中:
using system.collections.generic;using system.linq;using system.web.mvc;using mvcapplication1.models;namespace mvcapplication1.controllers{ public class homecontroller : controller { public actionresult index() { return view(); } public actionresult load(string pre) { var result = getallteams().where(t => t.preletter == pre).tolist(); viewbag.msg = 通过mvc ajax helper到达这里~~; return partialview(teamy, result); } private list getallteams() { return new list() { new team(){name = 巴西队, preletter = b}, new team(){name = 克罗地亚队, preletter = k}, new team(){name = 巴拉圭, preletter = b}, new team(){name = 韩国, preletter = k} }; } }}
部分视图和上一种方式一样。
页面刷新的方式加载部分视图方法包括:
html.renderpartial()
html.renderaction()
下面给大家介绍mvc中实现部分内容异步加载
action中定义一个得到结果集的方法
public actionresult getitemtree(string title, int itemid, int? page) { pp = new pagingparam(page ?? 1, vconfig.webconstconfig.pagesize); common.page.pagedlist res_item_resource_r = iresourceservice.getres_item_resource_rbyitemid(itemid, pp); viewdata[res_item_resource_r] = res_item_resource_r; res_item_resource_r.addparameters = new system.collections.specialized.namevaluecollection(); res_item_resource_r.addparameters.add(title, title); res_item_resource_r.addparameters.add(itemid, itemid.tostring()); viewresult vr = new viewresult { viewdata = viewdata, mastername = , }; return vr; }
在主页面使用下面jquery代码异步调用上面的action
$(function () { var id = ''; $.ajax({ type: post, url: /student/getitemtree, data: { title: '', itemid: id, page: 1 }, beforesend: function (data) { //取回数据前 $(#itemtree).html('数据加载中...'); }, error: function (data) { //发生错误时// debugger; }, success: function (data) { //成功返回时 $(#itemtree).html(data); } });
最后在分部视图getitemtree.ascx中写上你要返回的数据结构即可
注意一点就是,如果涉及到分页,要用ajax分页方式

其它类似信息

推荐信息