zoukankan      html  css  js  c++  java
  • ASP.NET中使用JSON方便实现前台与后台的数据交换

    ASP.NET中使用JSON方便实现前台与后台的数据交换

    发表于2014/9/13 6:47:08  8652人阅读

    分类: ASP.NET Jquery extjs

    一、前台向后台请求数据

    在页面加载时,有时需要对一些表单进行初始化,此时可以利用JQuery的 get 函数向后台发起异步请求:

    /初始化函数

    function initSettings() {

            $.get("?Action=init", function (data) {

                if (data == "NO") {

                    alert("初始化失败!");

                }

                else if (data != null && data != undefined) {

                    var json = JSON.parse(data);

                    setFieldsData(json);

                }

            });

        }

        //填充表单数据

        function setFieldsData(json) {

            $("#userSettings input:text").each(function () {

                $(this).val(json[$(this).attr("name")]);

            });

        }

    其中,各表单中含有一个name属性,其值为数据库对应的字段名。 后台的响应如下:

    if (Action == "init")

                {

                    string json = "{";

                    DataSet ds = new DataSet(); // 此处以加载用户信息为例

                    ds = DataOperation.DB.Select("select * from USER_USER where USER_ID=" + USER_ID, DataOperation.DB.GetConnType());

                    ds.Dispose();

                    if (ds.Tables[0].Rows.Count > 0)

                    {

                        for (int i = 0; i < ds.Tables[0].Columns.Count; i++)

                        {

                            json +=""" + ds.Tables[0].Columns[i].ColumnName+"":""+ds.Tables[0].Rows[0][i]+"",";

                        }

                        json = json.Substring(0, json.Length - 1);

                        json += "}";

                        try

                        {   

                            Response.Write(json);

                            Response.End();

                        }

                        catch (Exception)

                        {

                        }

                    }

                    else

                    {

                        Response.Write("NO");

                        Response.End();

                    }

                }

    二、前台向后台提交数据

    在表单填好后,保存时需要向后台提交数据,利用JSON 可以很方便的获取各表单数据提交并写入到数据库。前台JS 代码如下:

    <pre name="code" class="javascript">$("#saveSettings").click(function () {

                var json = "{";

                $("#userSettings input:text").each(function () {

                    json +="""+$(this).attr("name")+"":""+$(this).val()+"",";  // 获取表单值生成 JSON 格式数据

                });

                json = json.substring(0, json.length - 1);

                json += "}";

                $.post("?Action=save&json=" + json, function (data) {

                    if (data == "NO") {

                         alert("保存失败!");            

                    }

                    if (data == "OK") {

                        alert("保存成功!");

                    }

                });

            });

     </pre><br>

    <br>

    <pre class="java;"></pre>

    <p></p>

    <p>   后台响应代码如下:</p>

    <p></p>

    <pre class="java;">if (Action=="save")

                {

                    string sqlstr ="update USER_USER set "; 

                    string json =Request["json"];

                    JavaScriptSerializer serializer = new JavaScriptSerializer();

                    Dictionary<string, object=""> data = (Dictionary<string, object="">)serializer.DeserializeObject(json);

                    foreach (var item in data)

                    {

                        sqlstr += item.Key + " = '" + item.Value + "',";

                    }

                    sqlstr = sqlstr.Substring(0, sqlstr.Length - 1);

                    sqlstr += "where USER_ID=" + USER_ID;

                    

                    DataSet ds = new DataSet();

                    ds = DataOperation.DB.Select("select USER_ID from USER_USER where USER_ID=" + USER_ID , DataOperation.DB.GetConnType());

                    ds.Dispose();

                    if (ds.Tables[0].Rows.Count>0)

                    {

                        try

                        {

                            DataOperation.DB.Execnonsql(sqlstr, DataOperation.DB.GetConnType());

                            Response.Write("OK");

                            Response.End();

                        }

                        catch (Exception)

                        {

      

                        }

                    }

                    else

                    {

                        Response.Write("NO");

                        Response.End();

                    }

                }</string,></string,></pre><br>

    上面的代码中,使用了 JavaScriptSerializer 类和 Dictionary 类来解析 JSON 数据,将 JSON 数据解析成字典,方便SQL语句的生成。<br>

    <br>

    <br>

    <p></p>     

  • 相关阅读:
    深入理解Java容器——HashMap
    深入理解Java并发容器——ConcurrentHashMap
    String、StringBuilder和StringBuffer的比较
    接口类、抽象类和普通类的区别
    跟我一起学算法——二项堆
    跟我一起学算法——分治法
    跟我一起学算法——动态规划
    跟我一起学算法——斐波那契堆
    Redis操作三部曲:SpringBoot2.0.X集成Redis + Redis分布式锁 + RedisCacheManager配置
    SpringBoot使用Redis做集中式缓存
  • 原文地址:https://www.cnblogs.com/skyay/p/8387150.html
Copyright © 2011-2022 走看看