zoukankan      html  css  js  c++  java
  • 将table中的值转换成json格式传到后台接收处理。

    table数据

    <table style="border:1px" id="tableID">
            <tr>
                <th>编号</th>
                <th>姓名</th>
                <th>年龄</th>
                <th>性别</th>
            </tr>
            <tr>
                <td>1</td>
                <td>张三</td>
                <td>16</td>
                <td>男</td>
            </tr>
            <tr>
                <td>2</td>
                <td>李四</td>
                <td>18</td>
                <td>男</td>
            </tr>
            <tr>
                <td>3</td>
                <td>王五</td>
                <td>20</td>
                <td>女</td>
            </tr>
        </table>
    

      js方法

    <script type="text/javascript">
            $(function () {
                var tabLen = document.getElementById("tableID");
                var jsonT = "[";
                for (var i = 1; i < tabLen.rows.length; i++) {
                        jsonT += '{"ID":' + tabLen.rows[i].cells[0].innerHTML + ',"Name":"' + tabLen.rows[i].cells[1].innerHTML + '","Age":' + tabLen.rows[i].cells[2].innerHTML + ',"Gender":"' + tabLen.rows[i].cells[3].innerHTML + '"},'
                }
                jsonT= jsonT.substr(0, jsonT.length - 1);
                jsonT += "]";
                console.log(jsonT);
                $.ajax({
                    type: 'post',
                    url: '/Home/GetJson',
                    data:{students:jsonT},
                    success: function (data) {
                        alert(1);
                    }
                });      
            });
        </script>
    

      后台接收方法

      public ActionResult GetJson(string students)
            {
                JavaScriptSerializer js = new JavaScriptSerializer();
                List<Student> list = js.Deserialize<List<Student>>(students);
                return Content("ok");
            }

      Student类

    public class Student
        {
            public int ID { get; set; }
            public string Name { get; set; }
            public int Age { get; set; }
            public string Gender { get; set; }
        }
    

      

  • 相关阅读:
    吹气球
    Leetcode 235
    什么是BPMN网关?
    BPMN中的任务和活动之间有什么区别?
    两款流程图设计推荐
    Activiti7.1, jBPM7.25, Camunda, Flowable6.3技术组成对比
    Flowable与activiti对比
    机器学习中的数学
    WopiServerTutorial
    如何整合Office Web Apps至自己开发的系统(二)
  • 原文地址:https://www.cnblogs.com/zhuyuchao/p/6814040.html
Copyright © 2011-2022 走看看