zoukankan      html  css  js  c++  java
  • mvc4中使用部分视图局部刷新实例

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

    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);
            }            
  • 相关阅读:
    appdata文件夹有什么用途?C盘appdata可以删除吗?
    白话讲MyIsam和InnoDB的区别
    MVC&&MVP
    计算机程序的思维逻辑- 函数调用的基本原理
    猫狗收养所
    博客学习分类
    Android之操作SQLite
    总结---20160508
    对栈元素排序
    集合栈
  • 原文地址:https://www.cnblogs.com/lunawzh/p/6111246.html
Copyright © 2011-2022 走看看