页面同时传多条数据到后台并保存到数据库

Posted 2020-10-11

需求场景：需要同时提交多条数据到数据库的应用场景，如保存购物订单等

思路：前台js获取需要提交数据，拼写成json字符串传入后台，后台解析保存数据库。

实例：

        function makeJson(){
              var rows = document.getElementById("Table").rows; //获得行数(包括thead)
              var colums = document.getElementById("Table").rows[0].cells.length; //获得列数
              console.log(rows);
              console.log(colums);
              console.log(rows[1].cells[2]);
                 var arr=[];  //json对象容器
                var obj={"id":"",      //创建数据对象
                                 "set_id":"",
                                 "islist":"",
                                 "isedit":"",
                                 "dict_type":"",
                                 "column_name":"",
                                 "java_type":"",
                                 "java_attribute_name":"",
                                 "isnull":"",
                                 "data_type":"",
                                 "isquery":"",
                                 "query_type":"",
                                 "isshowinlist":"",
                                 "ispk":"",
                                 "show_type":"",
                                 "column_comment":"",
                                 "sort":""
                                 };
                    for(var i=1;i<rows.length;i++){ //获取表格数据,因为列数已经固定，所以直接获取了，其实可以通过循环遍历来的到
                        var obj = new Object();//这里一定要new新的对象，要不然保存的都是一样的数据；都是最后一行的数据
                        obj.column_name=$("#column_name"+i).val();
                        obj.column_comment=$("#column_comment"+i).val();
                        obj.data_type=$("#data_type"+i).val();
                        obj.java_type=$("#java_type"+i).val();
                        obj.java_attribute_name=$("#java_attribute_name"+i).val();
                        obj.ispk=$("#ispk"+i).val();
                        obj.isnull=$("#isnull"+i).val();
                        obj.isedit=$("#isedit"+i).val();
                        obj.islist=$("#islist"+i).val();
                        obj.isshowinlist=$("#isshowinlist"+i).val();
                        obj.isquery=$("#isquery"+i).val();
                        obj.query_type=$("#query_type"+i).val();
                        obj.show_type=$("#show_type"+i).val();
                        obj.dict_type=$("#dict_type"+i).val();
                        obj.sort=$("#sort"+i).val();
                         arr.push(obj);//向JSON数组添加JSON对象的方法；很关键
                    }
                      ///格式化数据
                     var jsonobj=JSON.stringify(arr);//这一行很关键
                     //将数据赋值通过按钮提交到后台
                     $("#jsonString").val(jsonobj);

                    

                }

本文出自 “abc” 博客，请务必保留此出处http://10264855.blog.51cto.com/10254855/1974082