odoo表单相关的附件文档如果过多，逐个本地选择上传也是一种负担，比较好的方式是适配现代H5浏览器文件选择对话框原生的多选功能，这可以大大提高多文件操作效率
基础结构：file元素添加multiple属性
|
1 |
<input type="file" multiple="true" class="o_form_file_upload_input"/> |
事件支持：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 |
/** * author: i@renjie.me */ FormView.include({ render_buttons: function() { var self = this; var add_button = false; if(!self.$buttons){ add_button = true; } self._super.apply(self, arguments); if(add_button && self.$buttons){ // 文件选择事件 self.$buttons.find('.o_form_file_upload_input').change(function(evt){ var target = evt.target; var $form = $(target.form); var $file = $(target); var value = $file.val(); // 选择一个或多个文件 if($file.val() !== ''){ var $badge = $form.find(".badge"); var serialize = $form.serializeArray(); var files = $file.get(0).files; var count = files.length; var error = []; // 界面阻塞 framework.blockUI(); // 个数提示 $badge.text(count); // 并行异步上传 _.each(files, function(file, index){ var data = new FormData(); data.append('ufile',file); _.each(serialize, function(param){ data.append(param.name, param.value); }); $.ajax({ url: $form.attr("action"), type: 'POST', data: data, cache: false, processData: false, contentType: false, success: function(ret){ if(ret.error){ error.push(ret.error); } count--; // 上传完成 if(count == 0){ framework.unblockUI(); if(self.sidebar){ self.sidebar.do_attachement_update(self.dataset, self.datarecord.id, [{ "error": error.join("<br/>") }]); } } $badge.text(count ? count : ""); } }); }); $file.val(""); } }); } return self.$buttons; } }); |