作者 Karson

更新plupload上传后填充文本框的方式

@@ -188,7 +188,7 @@ class Crud extends Command @@ -188,7 +188,7 @@ class Crud extends Command
188 //如果是图片则额外附加 188 //如果是图片则额外附加
189 if (substr($field, -5) == 'image' || substr($field, -6) == 'avatar') 189 if (substr($field, -5) == 'image' || substr($field, -6) == 'avatar')
190 { 190 {
191 - $attr['data-plupload-id'] = "plupload-{$field}-text"; 191 + //$attr['data-plupload-id'] = "plupload-{$field}-text";
192 $attr['size'] = 50; 192 $attr['size'] = 50;
193 } 193 }
194 $fieldFunc = substr($field, -4) == 'time' ? "|datetime" : ""; 194 $fieldFunc = substr($field, -4) == 'time' ? "|datetime" : "";
@@ -377,7 +377,7 @@ EOD; @@ -377,7 +377,7 @@ EOD;
377 return <<<EOD 377 return <<<EOD
378 <div class="form-inline"> 378 <div class="form-inline">
379 {$content} 379 {$content}
380 - <span><button id="plupload-{$field}" class="btn btn-danger plupload" ><i class="fa fa-upload"></i> {:__('Upload')}</button></span> 380 + <span><button id="plupload-{$field}" class="btn btn-danger plupload" data-input-id="c-{$field}"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
381 </div> 381 </div>
382 EOD; 382 EOD;
383 } 383 }
@@ -2,28 +2,28 @@ @@ -2,28 +2,28 @@
2 <div class="form-group"> 2 <div class="form-group">
3 <label for="c-upyun" class="control-label col-xs-12 col-sm-2">{:__('Upload')}:</label> 3 <label for="c-upyun" class="control-label col-xs-12 col-sm-2">{:__('Upload')}:</label>
4 <div class="col-xs-12 col-sm-8"> 4 <div class="col-xs-12 col-sm-8">
5 - <input type="text" name="row[upyun]" id="c-upyun" class="form-control" cols="60" data-plupload-id="plupload-upyun-text" /> 5 + <input type="text" name="row[upyun]" id="c-upyun" class="form-control" cols="60" />
6 </div> 6 </div>
7 </div> 7 </div>
8 8
9 <div class="form-group"> 9 <div class="form-group">
10 <label for="c-upyun" class="control-label col-xs-12 col-sm-2"></label> 10 <label for="c-upyun" class="control-label col-xs-12 col-sm-2"></label>
11 <div class="col-xs-12 col-sm-8"> 11 <div class="col-xs-12 col-sm-8">
12 - <button id="plupload-upyun" class="btn btn-danger plupload" ><i class="fa fa-upload"></i> {:__("Upload to upyun")}</button> 12 + <button id="plupload-upyun" class="btn btn-danger plupload" data-input-id="c-upyun" ><i class="fa fa-upload"></i> {:__("Upload to upyun")}</button>
13 </div> 13 </div>
14 </div> 14 </div>
15 15
16 <div class="form-group"> 16 <div class="form-group">
17 <label for="c-local" class="control-label col-xs-12 col-sm-2">{:__('Upload')}:</label> 17 <label for="c-local" class="control-label col-xs-12 col-sm-2">{:__('Upload')}:</label>
18 <div class="col-xs-12 col-sm-8"> 18 <div class="col-xs-12 col-sm-8">
19 - <input type="text" name="row[local]" id="c-local" class="form-control" cols="60" data-plupload-id="plupload-local-text" /> 19 + <input type="text" name="row[local]" id="c-local" class="form-control" cols="60" />
20 </div> 20 </div>
21 </div> 21 </div>
22 22
23 <div class="form-group"> 23 <div class="form-group">
24 <label for="c-local" class="control-label col-xs-12 col-sm-2"></label> 24 <label for="c-local" class="control-label col-xs-12 col-sm-2"></label>
25 <div class="col-xs-12 col-sm-8"> 25 <div class="col-xs-12 col-sm-8">
26 - <button id="plupload-local" class="btn btn-primary plupload" data-url="{:url('ajax/upload')}" data-after-upload="afteruploadcallback"><i class="fa fa-upload"></i> {:__("Upload to local")}</button> 26 + <button id="plupload-local" class="btn btn-primary plupload" data-input-id="c-local" data-url="{:url('ajax/upload')}" data-after-upload="afteruploadcallback"><i class="fa fa-upload"></i> {:__("Upload to local")}</button>
27 </div> 27 </div>
28 </div> 28 </div>
29 29
@@ -28,8 +28,8 @@ @@ -28,8 +28,8 @@
28 <label for="c-image" class="control-label col-xs-12 col-sm-2">{:__('Image')}:</label> 28 <label for="c-image" class="control-label col-xs-12 col-sm-2">{:__('Image')}:</label>
29 <div class="col-xs-12 col-sm-8"> 29 <div class="col-xs-12 col-sm-8">
30 <div class="form-inline"> 30 <div class="form-inline">
31 - <input id="c-image" class="form-control" data-plupload-id="plupload-image-text" size="50" name="row[image]" type="text" value="">  
32 - <span><button id="plupload-image" class="btn btn-danger plupload" ><i class="fa fa-upload"></i> {:__('Upload')}</button></span> 31 + <input id="c-image" class="form-control" size="50" name="row[image]" type="text" value="">
  32 + <span><button id="plupload-image" class="btn btn-danger plupload" data-input-id="c-image"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
33 </div> 33 </div>
34 </div> 34 </div>
35 </div> 35 </div>
@@ -28,8 +28,8 @@ @@ -28,8 +28,8 @@
28 <label for="c-image" class="control-label col-xs-12 col-sm-2">{:__('Image')}:</label> 28 <label for="c-image" class="control-label col-xs-12 col-sm-2">{:__('Image')}:</label>
29 <div class="col-xs-12 col-sm-8"> 29 <div class="col-xs-12 col-sm-8">
30 <div class="form-inline"> 30 <div class="form-inline">
31 - <input id="c-image" class="form-control" data-plupload-id="plupload-image-text" size="50" name="row[image]" type="text" value="{$row.image}">  
32 - <span><button id="plupload-image" class="btn btn-danger plupload" ><i class="fa fa-upload"></i> {:__('Upload')}</button></span> 31 + <input id="c-image" class="form-control" size="50" name="row[image]" type="text" value="{$row.image}">
  32 + <span><button id="plupload-image" class="btn btn-danger plupload" data-input-id="c-image"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
33 </div> 33 </div>
34 </div> 34 </div>
35 </div> 35 </div>
@@ -81,8 +81,8 @@ @@ -81,8 +81,8 @@
81 <label for="c-avatar" class="control-label col-xs-12 col-sm-2">{:__('Avatar')}:</label> 81 <label for="c-avatar" class="control-label col-xs-12 col-sm-2">{:__('Avatar')}:</label>
82 <div class="col-xs-12 col-sm-8"> 82 <div class="col-xs-12 col-sm-8">
83 <div class="form-inline"> 83 <div class="form-inline">
84 - <input type="text" name="row[avatar]" value="" id="c-avatar" class="form-control "required data-plupload-id="plupload-avatar-text" size="50" />  
85 - <span><button id="plupload-avatar" class="btn btn-danger plupload" ><i class="fa fa-upload"></i> {:__("Upload")}</button></span> 84 + <input type="text" name="row[avatar]" value="" id="c-avatar" class="form-control" required size="50" />
  85 + <span><button id="plupload-avatar" class="btn btn-danger plupload" data-input-id="c-avatar"><i class="fa fa-upload"></i> {:__("Upload")}</button></span>
86 </div> 86 </div>
87 </div> 87 </div>
88 </div> 88 </div>
@@ -82,8 +82,8 @@ @@ -82,8 +82,8 @@
82 <label for="c-avatar" class="control-label col-xs-12 col-sm-2">{:__('Avatar')}:</label> 82 <label for="c-avatar" class="control-label col-xs-12 col-sm-2">{:__('Avatar')}:</label>
83 <div class="col-xs-12 col-sm-8"> 83 <div class="col-xs-12 col-sm-8">
84 <div class="form-inline"> 84 <div class="form-inline">
85 - <input type="text" name="row[avatar]" value="{$row.avatar}" id="c-avatar" class="form-control" required data-plupload-id="plupload-avatar-text" size="50" />  
86 - <span><button id="plupload-avatar" class="btn btn-danger plupload" ><i class="fa fa-upload"></i> {:__("Upload")}</button></span> 85 + <input type="text" name="row[avatar]" value="{$row.avatar}" id="c-avatar" class="form-control" required size="50" />
  86 + <span><button id="plupload-avatar" class="btn btn-danger plupload" data-input-id="c-avatar"><i class="fa fa-upload"></i> {:__("Upload")}</button></span>
87 </div> 87 </div>
88 </div> 88 </div>
89 </div> 89 </div>
@@ -3,21 +3,21 @@ @@ -3,21 +3,21 @@
3 //上传配置 3 //上传配置
4 return [ 4 return [
5 /** 5 /**
6 - * 上传地址,如果不使用又拍云,则可以使用ajax/upload 6 + * 上传地址,默认是本地上传,如果需要使用又拍云则改为http://v0.api.upyun.com/yourbucketname
7 */ 7 */
8 'uploadurl' => 'ajax/upload', 8 'uploadurl' => 'ajax/upload',
9 /** 9 /**
10 * 又拍云或本机的CDN地址 10 * 又拍云或本机的CDN地址
11 */ 11 */
12 - 'cdnurl' => '', 12 + 'cdnurl' => 'http://yourbucketname.b0.upaiyun.com',
13 /** 13 /**
14 * 上传成功后的通知地址 14 * 上传成功后的通知地址
15 */ 15 */
16 - 'notifyurl' => '', 16 + 'notifyurl' => 'http://www.yoursite.com/upyun/notify',
17 /** 17 /**
18 * 又拍云Bucket 18 * 又拍云Bucket
19 */ 19 */
20 - 'bucket' => '', 20 + 'bucket' => 'yourbucketname',
21 /** 21 /**
22 * 生成的policy有效时间 22 * 生成的policy有效时间
23 */ 23 */
@@ -19,6 +19,7 @@ define(['jquery', 'bootstrap', 'backend', 'config', 'plupload'], function ($, un @@ -19,6 +19,7 @@ define(['jquery', 'bootstrap', 'backend', 'config', 'plupload'], function ($, un
19 var multiple = $(this).data("multiple"); 19 var multiple = $(this).data("multiple");
20 //上传URL 20 //上传URL
21 url = url ? url : Config.upload.uploadurl; 21 url = url ? url : Config.upload.uploadurl;
  22 + url = Backend.api.fixurl(url);
22 //最大可上传 23 //最大可上传
23 maxsize = maxsize ? maxsize : Config.upload.maxsize; 24 maxsize = maxsize ? maxsize : Config.upload.maxsize;
24 //文件类型 25 //文件类型
@@ -50,7 +51,7 @@ define(['jquery', 'bootstrap', 'backend', 'config', 'plupload'], function ($, un @@ -50,7 +51,7 @@ define(['jquery', 'bootstrap', 'backend', 'config', 'plupload'], function ($, un
50 //这里可以改成其它的表现形式 51 //这里可以改成其它的表现形式
51 //document.getElementById('filelist').innerHTML += '<div id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></div>'; 52 //document.getElementById('filelist').innerHTML += '<div id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></div>';
52 }); 53 });
53 - $("#" + id).data("bakup-html", $("#" + id).html()); 54 + $(that).data("bakup-html", $(that).html());
54 //添加后立即上传 55 //添加后立即上传
55 setTimeout(function () { 56 setTimeout(function () {
56 Upload.list[id].start(); 57 Upload.list[id].start();
@@ -59,11 +60,11 @@ define(['jquery', 'bootstrap', 'backend', 'config', 'plupload'], function ($, un @@ -59,11 +60,11 @@ define(['jquery', 'bootstrap', 'backend', 'config', 'plupload'], function ($, un
59 UploadProgress: function (up, file) { 60 UploadProgress: function (up, file) {
60 //这里可以改成其它的表现形式 61 //这里可以改成其它的表现形式
61 //document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>"; 62 //document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
62 - $("#" + id).prop("disabled", true).html("<i class='fa fa-upload'></i> 上传" + file.percent + "%"); 63 + $(that).prop("disabled", true).html("<i class='fa fa-upload'></i> 上传" + file.percent + "%");
63 }, 64 },
64 FileUploaded: function (up, file, info) { 65 FileUploaded: function (up, file, info) {
65 //还原按钮文字及状态 66 //还原按钮文字及状态
66 - $("#" + id).prop("disabled", false).html($("#" + id).data("bakup-html")); 67 + $(that).prop("disabled", false).html($(that).data("bakup-html"));
67 //这里可以改成其它的表现形式 68 //这里可以改成其它的表现形式
68 //document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML += (' [Url]: ' + '<a href="' + url + '" target="_blank">' + url + '</a>'); 69 //document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML += (' [Url]: ' + '<a href="' + url + '" target="_blank">' + url + '</a>');
69 //这里建议不修改 70 //这里建议不修改
@@ -75,7 +76,10 @@ define(['jquery', 'bootstrap', 'backend', 'config', 'plupload'], function ($, un @@ -75,7 +76,10 @@ define(['jquery', 'bootstrap', 'backend', 'config', 'plupload'], function ($, un
75 var data = ret.hasOwnProperty("data") && ret.data != "" ? ret.data : null; 76 var data = ret.hasOwnProperty("data") && ret.data != "" ? ret.data : null;
76 var msg = ret.hasOwnProperty("msg") && ret.msg != "" ? ret.msg : ""; 77 var msg = ret.hasOwnProperty("msg") && ret.msg != "" ? ret.msg : "";
77 if (ret.code === 1) { 78 if (ret.code === 1) {
78 - $("input[data-plupload-id='" + id + "-text']").val(data.url); 79 + //$("input[data-plupload-id='" + id + "-text']").val(data.url);
  80 + if ($(that).data("input-id")) {
  81 + $("input#" + $(that).data("input-id")).val(data.url);
  82 + }
79 var afterUpload = $("#" + id).data("after-upload"); 83 var afterUpload = $("#" + id).data("after-upload");
80 if (afterUpload && typeof Upload.api.custom[afterUpload] == 'function') { 84 if (afterUpload && typeof Upload.api.custom[afterUpload] == 'function') {
81 Upload.api.custom[afterUpload].call(that, data); 85 Upload.api.custom[afterUpload].call(that, data);