mvc4中使用部分视图局部刷新实例

最新推荐文章于 2021-08-05 15:49:15 发布

weixin_34413357

最新推荐文章于 2021-08-05 15:49:15 发布

阅读量184

点赞数

CC 4.0 BY-SA版权

文章标签：测试

原文链接：http://www.cnblogs.com/lunawzh/p/6111246.html

本文介绍了一个使用ASP.NET MVC实现局部刷新的例子。通过点击按钮将文本框内容提交到服务器，并在页面的部分视图中更新显示。示例包含主视图、部分视图及控制器代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如上效果图，网页中有主视图（上）和部分视图（下），点击提交会把文本框中的值发送到服务器，再返回所有添加的信息，在下方局部更新（只更新部分视图），实现如下：

1、网页主视图代码：

@model MvcApplication1.Models.User

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
<input id="txt" /><button id="btn">提交(局部实现刷新)</button>
<div id="data">
   @{Html.RenderAction("GetData");}
</div>
<hr />

<script>
    $("#btn").click(function () {
        $("#data").load("/home/getdata", { "message": $("#txt").val() }, function () {
            alert("提交成功");
        });
    });
</script>

2、部分视图：

@model IEnumerable<MvcApplication1.Models.msg>
<p>以下是部分视图内容</p>
@foreach (var item in Model)
            {
    <p>@item.message</p>
    <hr />
            }

3、controller

       PrintingEntities db = new PrintingEntities();//EF
       
        public ActionResult Index()
        {
            return View();
        }
        public ActionResult GetData(msg msg)
        {
            db.msgs.Add(msg);
            db.SaveChanges();
           var list = db.msgs.OrderByDescending(x=>x.id).ToList();
           return PartialView(list);
        }

转载于:https://www.cnblogs.com/lunawzh/p/6111246.html