ASP.NET MVC3 异步刷新

2011-08-13 09:51:53

标签:MVC3 异步刷新 休闲 N Layer 职场
原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 、作者信息和本声明。否则将追究法律责任。http://leelei.blog.51cto.com/856755/638408
好久没写博客了,今天就讲讲如何在ASP.NET MVC3中实现异步刷新。本次实例前台采用的是Razor引擎。首先看看系统结构,如图
本系统采用N Layer开发。我们以其中的某个具体模块作为案例来讲述。
@model TeacherPlatForm.Utility.PagedList<TeacherPlatForm.Domain.Entities.Generate.TASE_Thesis_Titles> 
<!DOCTYPE html> 
<html> 
<head> 
        <title>论文题目发布</title> 
        <link rel="Stylesheet" type="text/css" href="http://www.cnblogs.com/Content/Site.css" /> 
        <script type="text/javascript" src="http://www.cnblogs.com/Scripts/jquery-1.4.4.js"></script> 
        <script type="text/javascript" src="http://www.cnblogs.com/Scripts/jquery.unobtrusive-ajax.min.js"></script> 
        <link rel="Stylesheet" type="text/css" href="http://www.cnblogs.com/Scripts/jquery.autocomplete.css" /> 
        <script type="text/javascript" src="http://www.cnblogs.com/Scripts/jquery.autocomplete.js"></script> 
        <script type="text/javascript" src="http://www.cnblogs.com/Scripts/common.js"></script> 
        <script type="text/javascript" src="http://www.cnblogs.com/Scripts/teacherplat/thesistitlepublish.js"></script> 
</head> 
<body> 
        <div align="center"> 
                <div align="left" style="width: 96%; margin-top: 20px"> 
                        当前位置:论文题目发布 
                        <br /> 
                        <hr align="left" noshade="noshade" size="0.1" color="#b70005" /> 
                </div> 
                <input type="hidden" id="hfd_professional" value="@ViewBag.professional" /> 
                <input type="hidden" id="hfd_educationLevel" value="@ViewBag.educationId" /> 
                <input type="hidden" id="hfd_write_batchid" name="hfd_write_batchid" value="@ViewBag.writeBatchid" /> 
                @using (Ajax.BeginForm("ThesisOperation", "ThesisTitlePublish", new AjaxOptions { OnSuccess = "opersuccess()" })) 
                { 
                        Html.RenderPartial("~/Views/TeacherPlatForm/ThesisTitlePartial.cshtml"); 
                        <input type="hidden" id="hfd_sign" name="hfd_sign" /> 
                        <div> 
                                <input type="button" id="btnAdd" name="btnAdd" value="增加" class="btn" style="width: 60px" 
                                         />  
                                <input type="button" id="btnRemove" name="btnRemove" value="删除" class="btn" style="width: 60px" 
                                         />  
                                <input type="button" id="btnPublish" name="btnPublish" value="发布" class="btn" style="width: 60px" 
                                         /> 
                        </div> 
                } 
        </div> 
</body> 
</html>
在本页面我引用了一个partial页面代码如下
@model TeacherPlatForm.Utility.PagedList<TeacherPlatForm.Domain.Entities.Generate.TASE_Thesis_Titles> 
<div id="thesisTitle_tab"> 
        @Html.Hidden("thesisTitleIds", (Model != null ? string.Join("_", Model.DataList.Select(tt => tt.thesis_title_id)) : string.Empty)) 
        <table class="mytable" style="margin-top: 15px"> 
                <tr> 
                        <th> 
                                <center> 
                                        @Html.CheckBox("chk_all", new { id = "chkall", onclick = "checkall()" }) 
                                </center> 
                        </th> 
                        <th> 
                                <center> 
                                        题目</center> 
                        </th> 
                        <th> 
                                <center> 
                                        写作批次</center> 
                        </th> 
                        <th> 
                                <center> 
                                        专业名称</center> 
                        </th> 
                        <th> 
                                <center> 
                                        方向 
                                </center> 
                        </th> 
                        <th> 
                                <center> 
                                        发布状态</center> 
                        </th> 
                        <th> 
                                <center> 
                                        操作 
                                </center> 
                        </th> 
                </tr> 
                @if (Model != null && Model.DataList.Count > 0) 
                { 
                        foreach (var thesisTitle in Model.DataList) 
                        { 
                        <tr onclick="setCheck('@thesisTitle.thesis_title_id')"> 
                                <td align="center"> 
                                        @Html.CheckBox("chk_" + thesisTitle.thesis_title_id, new { id = "chk_" + thesisTitle.thesis_title_id, onclick = "setCheck('" + thesisTitle.thesis_title_id + "')" }) 
                                </td> 
                                <td> 
                                        @thesisTitle.title 
                                </td> 
                                <td> 
                                        @(thesisTitle.TASE_Write_Batch != null ? thesisTitle.TASE_Write_Batch.write_batch_name : string.Empty) 
                                </td> 
                                <td> 
                                        @(thesisTitle.TASE_Thesis_Direction != null ? (thesisTitle.TASE_Thesis_Direction.TASE_Professional != null ? thesisTitle.TASE_Thesis_Direction.TASE_Professional.name : string.Empty) : string.Empty) 
                                </td> 
                                <td> 
                                        @(thesisTitle.TASE_Thesis_Direction != null ? thesisTitle.TASE_Thesis_Direction.direct_name : string.Empty) 
                                </td> 
                                <td> 
                                        @(thesisTitle.state == "1" ? "已发布" : "未发布") 
                                </td> 
                                <td align="center"> 
                                        <input type="button" id="btnModify" name="btnModify" class="btn" value="修改" style="width:60px" onclick="showModifyModal('@thesisTitle.thesis_title_id')" /> 
                                </td> 
                        </tr> } 
                } 
        </table> 
        <div class="divpager"> 
                共有 <font color="red">@(Model != null ? Model.TotalCount : 0)</font> 条记录 当前是第 <font color="red">@(Model != null ? Model.PageIndex : 0)</font> 
                页 共<font color="red">@(Model != null ? Model.TotalPages : 0)</font>页     
                @if (Model!=null&&Model.HasPreviousPage) 
                { 
                        @Ajax.ActionLink("首页", "Index", "ThesisTitlePublish", new { id = 1 + "_" + 10 + "_" + DateTime.Now.Ticks }, new AjaxOptions { UpdateTargetId = "thesisTitle_tab" })<label> </label> 
                        @Ajax.ActionLink("上一页", "Index", "ThesisTitlePublish", new { id = (Model.PageIndex - 1) + "_" + 10 + "_" + DateTime.Now.Ticks }, new AjaxOptions { UpdateTargetId = "thesisTitle_tab" })<label> </label>    
                } 
                else 
                { 
                        <a>首页 </a>    
                        <a>上一页 </a> 
                } 
                @if (Model != null && Model.HasNextPage) 
                { 
                        @Ajax.ActionLink("下一页", "Index", "ThesisTitlePublish", new { id = (Model.PageIndex + 1) + "_" + 10 + "_" + DateTime.Now.Ticks }, new AjaxOptions { UpdateTargetId = "thesisTitle_tab" })<label> </label> 
                        @Ajax.ActionLink("末页", "Index", "ThesisTitlePublish", new { id = Model.TotalPages + "_" + 10 + "_" + DateTime.Now.Ticks }, new AjaxOptions { UpdateTargetId = "thesisTitle_tab" }) 
                } 
                else 
                { 
                        <a>下一页 </a>    
                        <a>末页 </a> 
                } 
        </div> 
</div>
现在我对分页采用了异步刷新,后台代码如下
 public ActionResult Index(string id) 
                { 
                        try 
                        { 
                                int pageSize = 10, pageIndex = 1; 
                                if (!string.IsNullOrEmpty(id)) 
                                { 
                                        pageIndex = int.Parse(id.Split('_')[0]); 
                                        pageSize = int.Parse(id.Split('_')[1]); 
                                } 
                                 
                                TASE_Write_Batch writeBatch = thesisTitlePublishService.GetWriteBatch(); 
                                PagedList<TASE_Thesis_Titles> thesisTitleList = thesisTitlePublishService.GetThesisTitleList((string)Session["userid"], writeBatch.write_batch_id, pageIndex, pageSize); 
                                if (Request.IsAjaxRequest()) 
                                { 
                                        return PartialView("~/Views/TeacherPlatForm/ThesisTitlePartial.cshtml", thesisTitleList); 
                                } 
                                return View("~/Views/TeacherPlatForm/ThesisTitlePublish.cshtml", thesisTitleList); 
                        } 
                        catch (Exception ex) 
                        { 
                                if (ex.GetType() == typeof(MyException)) 
                                { 
                                        ViewBag.errorMessage = ((MyException)(ex)).Message; 
                                        return View("~/Views/TeacherPlatForm/ErrorMessage.cshtml"); 
                                } 
                                else 
                                { 
                                        return View("~/Views/TeacherPlatForm/ThesisTitlePublish.cshtml", null); 
                                } 
                        } 
                }
在后台控制器判断如果是AJAX请求,返回一个Partial页面。去替换<div id="thesisTitle_tab">中的内容。怎么替换呢,看看partial页中的分页代码,@Ajax.ActionLink("首页", "Index", "ThesisTitlePublish", new { id = 1 + "_" + 10 + "_" + DateTime.Now.Ticks }, new AjaxOptions { UpdateTargetId = "thesisTitle_tab" })看见AjaxOptions有一个UpdateTargetId属性,这就是我们分页后要刷新的html标签的id。
对于增加删除我们也可以采用类似的方式,不过UpdateTargetId 要写在@using (Ajax.BeginForm("ThesisOperation", "ThesisTitlePublish", new AjaxOptions { OnSuccess = "opersuccess()" }))   中。这里我们采用了整页刷新
public JavaScriptResult RemoveThesisTitle(FormCollection fc) 
                { 
                        try 
                        { 
                                string thesisTitleId = fc["thesisTitleIds"]; 
                                if (thesisTitleId.Length == 0) 
                                { 
                                        return JavaScript("alert('请选择要删除的题目!')"); 
                                } 
                                string[] thesisTitleIds = thesisTitleId.Split(new char[] { '_' }, StringSplitOptions.RemoveEmptyEntries); 
                                foreach (var thesisTitleid in thesisTitleIds) 
                                { 
                                        string isChecked = fc["chk_" + thesisTitleid].Split(',')[0]; 
                                        if (isChecked.Equals("true")) 
                                        { 
                                                TASE_Thesis_Titles thesisTitles = thesisTitlePublishService.GetThesisTitles(thesisTitleid); 
                                                if (thesisTitles.state == "1") 
                                                { 
                                                        return JavaScript("alert('已发布的论文题目不能删除!')"); 
                                                } 
                                                thesisTitlePublishService.RemoveThesisTitle(thesisTitles); 
                                        } 
                                } 
                                thesisTitlePublishService.Commit(); 
                                return JavaScript("alert('删除成功!');window.location.href=window.location.href;"); 
                        } 
                        catch 
                        { 
                                return JavaScript("alert('删除失败!')"); 
                        } 
                }

本文出自 “微软技术” 博客,请务必保留此出处http://leelei.blog.51cto.com/856755/638408

转载于:https://www.cnblogs.com/ppcompany/articles/2674634.html

ASP.NET MVC3 异步刷新相关推荐

  1. asp.net mvc3 Razor引擎中@使用规则小记

    项目中前台用的是asp.net mvc3,Razor引擎(关于Razor的介绍可以参考:http://weblogs.asp.net/scottgu/archive/2010/07/02/introd ...

  2. [转] ASP.NET MVC3 路由和多数据集的返回

    1.ASP.NET MVC3 中的路由 同前边一样本篇并不会过多的介绍理论知识,我们在Global.asax.cs文件中可以看到如下代码: routes.MapRoute("Default& ...

  3. 实现ASP.NET MVC3 HtmlHelper 的 RadioButtonList 与CheckBoxList 扩展

    ASP.NET MVC3也出来有一段时间了,对于没有RadioButtonList 与CheckBoxList的问题,网上也已经有很多解决方案了,可以for循环拼接出来,也可以引用ASP.NET MV ...

  4. ASP.NET MVC3 快速入门--第二节 添加一个控制器

    MVC的全称为model-view-controller(模型-视图-控制器).MVC是一种开发应用程序的模式,这个模式已经具有了很好的框架架构,并且十分容易维护.使用MVC开发出来的应用程序一般包括 ...

  5. [译]Professional ASP.NET MVC3(01)-Chapter 1:Getting Started(上)

    本章概要 理解ASP.NET MVC ASP.NET MVC3 预览 如何创建MVC3应用程序 MVC应用程序结构 本章首先简要介绍ASP.NET MVC, 解释它怎样适应ASP.NET MVC的历史 ...

  6. 【转载】Asp.Net MVC3网站并成功的连接了MongoDB

    http://www.cnblogs.com/leo_wl/archive/2012/02/10/2345890.html 我们已经创建了一个简单的Asp.Net MVC3网站并成功的连接了Mongo ...

  7. Asp.Net MVC3.0网站统计登录认证的在线人数

    前言 对于一个网站来说,统计在线人数是一个很重要的工作.平时也发现很多的网站论坛等都有在线人数的显示.对于一个网站如果在线人数很多,用户看到了这么个数字也是很了不起的事情.由于之前对于这个知识点只是知 ...

  8. asp.net mvc3.0安装失败之终极解决方案

    安装失败截图 原因分析 因为vs10先安装了sp1补丁,然后安装的mvc3.0,某些文件被sp1补丁更改,导致"VS10-KB2483190-x86.exe"安装不了,造成安装失败 ...

  9. 一起谈.NET技术,在没有安装 ASP.NET MVC3 的服务器上运行 MVC3

    当在服务器上部署 ASP.NET MVC3 的应用的时候,可能会看到如下的错误信息: 这表示你的服务器上没有安装 ASP.NET MVC3. 解决这个问题的方法有两种: 第一,当然是在服务器上安装 A ...

最新文章

  1. asp.net过滤HTML标签的几个函数
  2. java websocket 上传大文件,使用java websocket API和Javascript上传文件
  3. 今天,小程序正式支持 SVG
  4. boost::units模块实现带有转换的用户定义单位的测试程序
  5. 127.0.0.1/dokuwiki/install.php,DokuWiki安装+集成markdown编辑器editor.md
  6. oracle expdp ora39070,expdp时出错:ORA-39070: Unable to open the log file.
  7. 如何避免程序员和产品经理打架?“微服务”或将成终极解决方案
  8. 随笔编号-03 基本类型相互转换集合
  9. WiFi曝出安全漏洞几近“裸奔”:运营商能借机收割一波红利吗?
  10. ASP与數据庫,文本文件鏈接精髓
  11. My Data Sructure TemplatesClass
  12. Linux下passwd和shadow文件内容详解
  13. 高等数学(第七版)同济大学 习题2-2 个人解答(前7题)
  14. linux查看端口命令ss,Linux查看端口号ss和losf指令
  15. Win10下次使用debug进入DOS进行汇编开发
  16. ROS2极简总结-文件系统
  17. 第一章 新科技革命引发产业革命
  18. AfterNodeInsertion方法
  19. Dialog based MFC
  20. 树莓派搭建家庭影音媒体系统Kodi

热门文章

  1. js正则限制字符串长度_正则笔记(3)万字长文,慎点。
  2. ARM和NEON指令 very nice
  3. U盘版便携式Linux制作, casper-rw 解析
  4. Linux目录架构详解
  5. 优质的程序员需为代码效率而呕心沥血
  6. 产品与市场,究竟哪一个重要
  7. 架构设计--仅是软件开发之第二大影响力?!
  8. 基于DirectShow的流媒体解码和回放
  9. 关键帧 关于decode_one_frame函数
  10. 解决:vue.esm.js?efeb:591 [Vue warn]: Do not use built-in or reserved HTML elements as component id: me