zoukankan      html  css  js  c++  java
  • ASP.NET MVC2 Ajax JSON的使用

    学习 2010-12-23 01:55:59 阅读145 评论0   字号: 订阅

        JSON (JavaScript Object Notation)一种简单的数据格式,比xml更轻巧。 JSON是JavaScript原生格式,这意味着在JavaScript中处理JSON数据不需要任何特殊的API或工具包。

    JSON的规则很简单:对象是一个无序的"'名称/值'对"集合。一个对象以"{"(左括号)开始,"}"(右括号)结束。每个"名称"后跟一个":"(冒号);"'名称/值' 对"之间使用","(逗号)分隔。具体细节参考http://www.json.org/json-zh.html

        举例:A: [{"name": "zhangsan"}]

         B: [{"name": "zhangsan", "sex": "man"}]

         C: [{"name": "zhangsan", "sex": "man"},{"name": "lili", "sex": "woman"}]

    里面的每一个中扩号里面的都是一项.对于C这个JSON,我们可以通过 C[0].name 取出zhangsan这个字段, C[1].sex取出lili及第二项所对应的sex "woman"

    通过这种方式,我们能够很容易的将数据库的各个字段的值一起传到页面去。在此我用mvc2 架构展示一下。所用数据库如下:

    ASP.NET MVC2 Ajax  JSON的使用 - huaiyaohuaiyao - 咖啡屋

    在此我只简单的演示用法,至于页面效果等就不做精美设计。页面很简单,只是点击button按钮,来显示出第二项的powername和powerCnName.

        View 层如下:

        <head runat="server">

           <title>Test</title>

           <script src="../../Scripts/jquery-1.4.1.js" type="text/javascript"></script>

        </head>

         <body>

              <div>

                      权限:<input type="text" id="name" /><br />

                      中文名:<input type="text" id="cname" /><br />

                      <input type="button" id="show" value="显示第二项" />

              </div>

               <script type="text/javascript">

                     $(document).ready(function() {

                       $("#show").click(function getDate() {

                       $.ajax({

                            url: "GetPower",

                            type: "post",

                            datatype: "json",

                             success: getdataresult

                             });

                       });

                       function getdataresult(data) { 

                         $("#name").val(data[1].name); 

                         $("#cname").val(data[1].Chinesename);

                         }

                        });

            </script>

         </body>

    Model层建了一个名叫Power类,专门负责读数据

    public class Power

    {

         CRMDataContext db = new CRMDataContext();

       

        public List<CRM_Power> GetAllPowers()

        {

             return db.CRM_Power.ToList();

        }

    }

        Controller层主要是为Ajax调用JSON写一个action

    public ActionResult Test()

    {

         return View();

    }

    public ActionResult GetPower()

    {

          Power p=new Power();

          var powers = p.GetAllPowers();

          ArrayList list = new ArrayList();

          foreach (var s in powers)

          {      

               Hashtable ha = new Hashtable();

               ha.Add("name", s.PowerName);

               ha.Add("Chinesename", s.PowerCnName);

               list.Add(ha);

           }

          return this.Json(list);

    }

        页面效果如下,如果用firebug调试,还可以发现页面相应如下

    ASP.NET MVC2 Ajax  JSON的使用 - huaiyaohuaiyao - 咖啡屋

    ASP.NET MVC2 Ajax  JSON的使用 - huaiyaohuaiyao - 咖啡屋

    ASP.NET MVC2 Ajax  JSON的使用 - huaiyaohuaiyao - 咖啡屋

  • 相关阅读:
    tarjan algorithm
    最小生成树
    Manacher's Algorithm (马拉车算法)
    KMP
    Trie(字典树)
    Hash
    GDB调试
    图论
    扫描线
    STL
  • 原文地址:https://www.cnblogs.com/encounter/p/2188790.html
Copyright © 2011-2022 走看看