zoukankan      html  css  js  c++  java
  • 同步 异步 加载分部视图

    主页面:
    @{
        Layout = null;
    }
     
    <! DOCTYPE html>
     
    < html>
    < head>
        <title >Index </ title>
        <script src ="@ Url.Content("~/Scripts/jquery-1.7.1.js" )"></ script >
        <script type ="text/javascript">
            @* 异步加载分部视图 *@
            $( function() {
                $( '#btn').click( function() {
                    $.ajax({                   
                        url: "/Home/GetDataDemo" ,
                        success: function(data) {
                            $( '#tBody').html(data);
                        }
                    });
                });
            })
        </script >
    </ head>
    < body>
        <div >
            < h1>< font color ="red">主页面 </ font></ h1 >
            < table border="1">
                < thead>
                    < th> 姓名 </th >
                    < th> 年龄 </th >
                    < th> 地址 </th >
                </ thead>
                < tbody id="tBody">
                    @*1.通过Action请求 *@
                    @* @{ Html.RenderAction("GetDataDemo", "Home");}  *@
                    @*    @Html.Action("GetDataDemo","Home") *@
                    @*2.通过  请求Index页面的时候就需要在Index方法传递ViewData["data"]过来 *@
                    @* @{ Html.RenderPartial("TableBody", ViewData["data"]);} *@
                    @*@Html.Partial("TableBody",ViewData["data"]) *@
                   
                    @*注意问题:1.RenderAction和RenderPartial需要大括号包括起来,而且注意不能少分号
                                2.注意传递数据给分部视图的时候不能为"动态"即ViewBag.Data
                                3.分部视图如果没有使用强类型,可以使用动态,但是ViewBag.data中的"data"必须和
                                  ViewData["data"]中的["data"]一致,否则报错,当然大小写没有关系
                    *@
                </ tbody>
            </ table>
            @* 点击按钮异步加载分部视图 *@
            < input id="btn" type ="button" name ="name" value ="动态加载分部视图" />
        </div >
    </ body>
    </ html>
    -------------------------------------------------------------------------------------------------------------
    分部视图
    @model IList<MvcApplication1.Controllers. Person>
              
    @{
        foreach ( var person in Model)
        {
            < tr>
                < td> @person.Name </ td>
                < td> @person.Age </ td>
                < td> @person.Address </ td>
            </ tr>
        }
    }
     
    @* 也可以使用动态*@
    @* @{
        foreach (var person in ViewBag.data)
        {
            <tr>
                <td>@person.Name</td>
                <td>@person.Age</td>
                <td>@person.Address</td>
            </tr>
        }
    } *@
     
    --------------------------------------------------------------------------
    后台代码:
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
     
    namespace MvcApplication1.Controllers
    {
        public class HomeController : Controller
        {
            //
            // GET: /Home/
     
            public ActionResult Index()
            {
                ViewData[ "data" ] = GetData();
                //ViewBag.Data = GetData();
                return View();
            }
     
            public ActionResult GetDataDemo()
            {
                return PartialView( "TableBody" , GetData());
            }
     
            private IList< Person> GetData()
            {
                IList< Person> persons = new List< Person>()
                {
                    new Person() {Name = "张三" , Address = "北京" , Age = 15},
                    new Person() {Name = "李四" , Address = "上海" , Age = 16},
                    new Person() {Name = "黄六" , Address = "深圳" , Age = 17},
                    new Person() {Name = "小小" , Address = "广州" , Age = 18}
                };
                return persons;
            }
     
        }
        public class Person
        {
            public string Name { set; get; }
            public int Age { set; get; }
            public string Address { set; get; }
        }
    }
  • 相关阅读:
    三次请求(读-改-读)引出nibernate 一级缓存
    算法竞赛入门经典第一、二章摘记
    uva 10905 Children's Game
    uva 11205 The broken pedometer
    uva 10160 Servicing stations
    uva 208 Firetruck
    uva 167 The Sultan's Successors
    zoj 1016 Parencodings
    uva 307 Sticks
    uva 216 Getting in Line
  • 原文地址:https://www.cnblogs.com/ddddai/p/3385193.html
Copyright © 2011-2022 走看看