
前端表单
<form class="form-horizontal" id="jsStayForm" method="post"> <table class="table"> <thead> <tr> <th>aaa</th> <th>bbb(GB)</th> <th>ccc</th> </tr> </thead> <tbody> <tr id="tradds"> <td> <select class="form-control" name="virtual_cpu1" id="virtual_cpu1"> {% for cpu_i in cpu_list %} <option value="{{ cpu_i }}">{{ cpu_i }}</option> {% endfor %} </select> </td> <td> <select class="form-control m-b" name="virtual_mem1" id="virtual_mem1"> {% for mem_i in mem_list %} <option value="{{ mem_i }}">{{ mem_i }}</option> {% endfor %} </select> </td> <td> <select class="form-control m-b" name="virtual_disk1" id="virtual_disk1"> {% for disk_i in disk_list %} <option value="{{ disk_i }}">{{ disk_i }}</option> {% endfor %} </select> </td> </tr> <tr id="tradds"> <td> <select class="form-control" name="virtual_cpu2" id="virtual_cpu2"> {% for cpu_i in cpu_list %} <option value="{{ cpu_i }}">{{ cpu_i }}</option> {% endfor %} </select> </td> <td> <select class="form-control m-b" name="virtual_mem2" id="virtual_mem2"> {% for mem_i in mem_list %} <option value="{{ mem_i }}">{{ mem_i }}</option> {% endfor %} </select> </td> <td> <select class="form-control m-b" name="virtual_disk2" id="virtual_disk2"> {% for disk_i in disk_list %} <option value="{{ disk_i }}">{{ disk_i }}</option> {% endfor %} </select> </td> </tr> <tr> <td> <select class="form-control" name="virtual_cpu3" id="virtual_cpu3"> {% for cpu_i in cpu_list %} <option value="{{ cpu_i }}">{{ cpu_i }}</option> {% endfor %} </select> </td> <td> <select class="form-control m-b" name="virtual_mem3" id="virtual_mem3"> {% for mem_i in mem_list %} <option value="{{ mem_i }}">{{ mem_i }}</option> {% endfor %} </select> </td> <td> <select class="form-control m-b" name="virtual_disk3" id="virtual_disk3"> {% for disk_i in disk_list %} <option value="{{ disk_i }}">{{ disk_i }}</option> {% endfor %} </select> </td> </tr> </tbody> </table> <button class="btn btn-primary" type="button" id="addCenterIpGrpBtn" Onclick="addCenterIpGrp(this)">新增一行</button> <button class="btn btn-primary" id="jsStayBtn">添加</button> {% csrf_token %} </form> # ajax 进行表单提交$('#jsStayForm').serialize() <script type="text/Javascript"> $('#jsStayBtn').click(function (event) { event.preventDefault(); console.log($('#jsStayForm').serialize()); alert($('#jsStayForm').serialize()); $.ajax({ cache: false, type: 'POST', url: '{% url "assets:virtualadd" %}', data: $('#jsStayForm').serialize(), datetype: 'json', .... .... }); }) </script> 提交后,获取到的值为
virtual_cpu1=1&virtual_mem1=8&virtual_disk1=50&virtual_vlan1=1021&project1=111&nums1=1&virtual_cpu3=2&virtual_mem3=12&virtual_disk3=200virtual_vlan3=1021&project3=222&nums3=1&virtual_cpu2=3&virtual_mem2=18&virtual_disk2=150&virtual_vlan2=1021&project2=3333&nums2=1 那么我后台要怎么拆分处理这一串内容。
def post(self, request): virtual_post_data = request.POST for key,value in virtual_post_data.items(): print(key,value) 打印出 key,value 值如下
virtual_cpu1 1 virtual_mem1 2 virtual_disk1 50 virtual_vlan1 1021 project1 nums1 1 virtual_cpu3 3 virtual_mem3 2 virtual_disk3 50 virtual_vlan3 1021 project3 nums3 1 virtual_cpu2 2 virtual_mem2 2 virtual_disk2 50 virtual_vlan2 1021 project2 nums2 1 我最终需要的结果是,key 值最后数字一样的分为一个组
[ {'virtual_cpu1':1,'virtual_mem1':2,'virtual_disk1':50}, {'virtual_cpu2':1,'virtual_mem2':2,'virtual_disk2':50}, {'virtual_cpu3':1,'virtual_mem3':2,'virtual_disk3':50} ] 现在问题是,取回的值都是一串字符的,不知如何进行分组,各位大佬提点意见,无论前端或者后端进行分组都行。
新增一个需求,前端需要下拉可选且可自行输入 网上搜了一个js插件
$('[id=virtual_mem]').editableSelect({ effects: 'slide' }); 多个相同ID进行选择,只有一个ID生效。
$(‘#virtual_mem,#virtual_mem,#virtual_disk').editableSelect({ effects: 'slide' }); 也是一个输入框生效的。这种的要怎么处理?

1 lenqu 2020-05-06 19:41:24 +08:00 把数据放到前段 json 处理 |
4 georgema1982 2020-05-07 01:40:20 +08:00 这种应该用 formset 处理 |
5 windychen0 2020-05-07 11:05:36 +08:00 function formatSubmitData(submitFormElement,isProcessData) { var formDataArr = $(submitFormElement).serializeArray(); var data = {}; for (var i = 0; i < formDataArr.length; i++) { data[formDataArr[i].name] = formDataArr[i].value; } return (isProcessData?data:JSON.stringify(data)); } <img src="https://s1.ax1x.com/2020/05/07/YZaaJU.png" alt="" /> 这样就好了 |
6 windychen0 2020-05-07 11:07:16 +08:00 大概的格式你还是要重新调整下吧...好像不完全是你要求的格式,console.log(data)看看就好了 |
7 fanne OP @windychen0 #6 OK,我试下,多谢。 |