美文网首页
json前后端交互

json前后端交互

作者: 青木川_ | 来源:发表于2019-03-13 17:17 被阅读1次

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="myselect.aspx.cs" Inherits="WebTest.Demos.myselect" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <style type="text/css">

        * {

            margin: 0;

            padding: 0;

        }

        .main {

            width: 100%;

            height: auto;

            border: 1px solid #DEDEDE;

        }

        .main_Ul {

            float: left;

            width: 100%;

            height: auto;

            border: 1px solid #DEDEDE;

            list-style: none;

        }

            .main_Ul li {

                float: left;

                width: 15%;

                height: 25px;

                border-right: 1px solid #DEDEDE;

            }

    </style>

</head>

<body>

    <form id="form1" runat="server">

        <input type="button" value="查询" onclick="sele()" />

        <div class="main">

        </div>

    </form>

    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>

    <script type="text/javascript">

        function sele() {

            $.ajax({

                type: "post",

                dataType: "json",

                data: { "method": "selectData" },

                url: "ashx/test.ashx",

                success: function (data) {

                    if (data != null) {

                        var html = "";

                        var book = eval(data);

                        console.log(book.length);

                        for (var i = 0; i < book.length; i++)

                        {

                            html += "<ul class='main_Ul'><li>" + book[i].name + "</li><li>" + book[i].sch_id + "</li><li>" + book[i].sex + "</li><li>" + book[i].isOk + "</li></ul>";

                        }

                        $(".main").html(html);

                    }

                }

            });

        }

    </script>

</body>

</html>

后台

public void ProcessRequest(HttpContext context)

        {

            context.Response.ContentType = "text/plain";

            string method = context.Request.Form["method"];

            var JsonString = string.Empty;

            if (method == "selectData")

            {

                using (var db = SugarDao.GetInstance())

                {

                    List<Student> student = db.Queryable<Student>().ToList();

                    #region 查询数据

                    JsonString = "[";

                    //lambda写法

                    for (int i = 0; i < student.Count; i++)

                    {

                        JsonString += "{";

                        JsonString += "\"name\":\"" + student[i].name + "\",\"sch_id\":\"" + student[i].sch_id + "\",\"sex\":\"" + student[i].sex + "\",\"isOk\":\"" + student[i].isOk + "\"";

                        JsonString = (i == student.Count-1) ? JsonString += "}" : JsonString += "},";

                    }

                    JsonString += "]";

                    #endregion

                    object jsonob = JsonConvert.SerializeObject(JsonString);

                    context.Response.Write(jsonob);

                }

            }

相关文章

  • 框架部分整理

    vue交互格式 2、json 后端交互注解 1、写在Controller类上的@RestController(@C...

  • 17.json、pickle、shelve模块

    一、json模块 1). json模块概述 json格式内容为字符串 json:前后端交互使用广泛的格式;配置文件...

  • json前后端交互

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind=...

  • @RequestParam无法取值

    在前后端使用ajax进行交互,contentType设置为application/json时,在前后台进行交互的时...

  • Flutter桌面版Json解析工具设计

    引子 前后端数据交互多用Json,比较好用的 json解析工具或者框架,比如:web版本的 jsonToDart,...

  • Json解析中@SerializedName注解妙用

    现在前后端通信交互普遍采用的是JSON格式数据传输,因此就需要解析JSON数据了。而如果前后端沟通不多,难免造成数...

  • python中的ajax

    前端与后端的数据交互,最常用的就是GET、POST,比较常用的用法是:提交表单数据到后端,后端返回json 前端的...

  • 前端与后端的数据交互(jquery ajax+python fl

    前端与后端的数据交互,最常用的就是GET、POST,比较常用的用法是:提交表单数据到后端,后端返回json 前端的...

  • JS-对象序列化

    JSON作为前后端交互的数据媒体,使用JOSN.stringify()将对象/数组转化为JSON字符串,使用JSO...

  • 前端工程师需要掌握的技能

    1、 HTML5、DIV+CSS、JS、XML、Json基础知识精通 2、熟悉几种后端语言,通晓前后端的交互方式,...

网友评论

      本文标题:json前后端交互

      本文链接:https://www.haomeiwen.com/subject/edptmqtx.html