JAVA高级面试进阶训练营视频教程

admin

　　今天在做与后台交互的的过程中，发现php对于接收的POST有一个限制，超出1000个字段之后便无法接收，项目要求在不改变PHP配置的情况下通过前端方式解决，通过分析并且网上差一些大牛的资料终于找到了解决方案，下面进行介绍：

　　首先，由于post的数据太多会导致PHP无法接收，那么解决思路就是将form表单中要进行提交的数据封装为一个json字段提交到后台，为了其他表单也会出现这样的问题，则将该方法封装为jQuery扩展的一个方法：

　　

 1 // submitButtonId 提交按钮id，formID表单id，formUrl表单提交url，
 2     setSerializeForm: function(submitButtonId, formID, formUrl, callback, clickFn)
 3     {
 4         if($.isFunction(clickFn))
 5         {
 6             clickFn();
 7         }
 8 
 9         var $submitButton = $(submitButtonId);
10         $(document).on('click', submitButtonId, function(event) {
11             $submitButton.val(v.submitting);
12             $submitButton.attr('disabled', true);
13 
14             // serializeArray() 方法通过序列化表单值来创建对象数组
15             // JSON.stringify 将任意的 JavaScript 值序列化成 JSON 字符串
16             var jsonData = $(formID).serializeArray();
17             var jsonStr  = JSON.stringify(jsonData);
18 
19             $.post(formUrl, {'jsonStr':jsonStr}, function(response){
20                 if(response.result == 'success'){
21                     $submitButton.popover({trigger:'manual', content:response.message, placement:'right'}).popover('show');
22                     $submitButton.next('.popover').addClass('popover-success');
23                     if(response.locate){
24                         setTimeout(function(){location.href = response.locate}, 1000);
25                     }
26                 } else {
27                     $submitButton.attr('disabled', false);
28                     $submitButton.val(v.saveOrder);
29 
30                     if($.type(response.message) == 'object')
31                     {
32                         $.each(response.message, function(key, value)
33                         {
34                             var errorOBJ   = '#' + key;
35                             var errorLabel =  key + 'Label';
36 
37                             if (typeof value == 'string' || Object.prototype.toString.call(value).indexOf('Array')>0)
38                             {
39                                 var errorContent = $.type(value) == 'string' ? value : value.join(';');
40                                 var errorMSG = '<span id="'  + errorLabel + '" for="' + key  + '"  class="text-error red">';
41                                 errorMSG += errorContent;
42                                 errorMSG += '</span>';
43                             }
44                             else
45                             {
46                                 var errorContent = '';
47                                 for (var error in value)
48                                 {
49                                     errorContent += value[error];
50                                     errorContent += '；'
51                                 }
52                                 errorContent.replace('。','')
53                                 var errorMSG = '<tr id='+ errorLabel + '><td colspan=13><span for="' + key  + '"  class="text-error red">';
54                                 errorMSG += errorContent;
55                                 errorMSG += '</span></td></tr>';
56                             }
57 
58                             $('#' + errorLabel).remove();
59 
60                             var $errorOBJ = $(errorOBJ);
61                             if($errorOBJ.closest('.input-group').length > 0)
62                             {
63                                 $errorOBJ.closest('.input-group').after(errorMSG)
64                             }
65                             else if(Object.prototype.toString.call(value).indexOf('Object')>0)
66                             {
67                                 $errorOBJ.after(errorMSG);
68                             }
69                             else
70                             {
71                                 $errorOBJ.parent().append(errorMSG);
72                             }
73                             $errorOBJ.css('margin-bottom', 0);
74                             $errorOBJ.css('border-color','#953B39');
75                             if($errorOBJ[0].id.indexOf('products') >= 0)
76                             {
77                                 var index = parseInt($errorOBJ.index("tr[id *= 'products']")) - errorLabelTotal;
78                                 errorLabelTotal++;
79                                 var $actionItem = $('.actionList-item:eq('+index+')');
80                                 $actionItem.css('margin-bottom','28px');
81                             }
82 
83                             $(errorOBJ).change(function()
84                             {
85                                 $('#' + errorLabel).remove();
86                             });
87                         });
88                     } else {
89                         $submitButton.popover({trigger:'manual', content:response.message, placement:'right'}).popover('show');
90                         $submitButton.next('.popover').addClass('popover-danger');
91                         function destroy(){$submitButton.popover('destroy')}
92                         setTimeout(destroy,3000);
93                     }
94                 }
95                 if($.isFunction(callback)) return callback(response);
96             }, 'json');
97         });
98     }

 

　　在调用该方法时只需要通过以下方式：

1 $.setSerializeForm('#submitOrder', '#orderAjaxForm', v.formUrl);