krajee 부트 스트랩 파일 입력 - uploadAsync를 사용하여 파일 당 추가 데이터를 보내려면 어떻게해야합니까? true

Question

layoutTemplates -> footerTemplate을 편집하여 이미지 당 주석을위한 텍스트 필드를 포함 시켰습니다. 그러나 데이터를 제출할 때 서버에 주석에 대한 POST가 없습니다.

var out = {}; 

      var i = 0; 
      out['commentsToUpdate'] = []; 

      $('.file-initial-thumbs .kv-input:visible').each(function() { 
       $el = $(this);       
       out["commentsToUpdate"][i] = $el.val(); 
       i++; 
      }); 

      var i = 0; 
      out['commentsToAdd'] = []; 

      $('.file-live-thumbs .kv-input:visible').each(function() { 
       $el = $(this);       
       out["commentsToAdd"][i] = $el.val()+"::+::"; 
       i++; 
      }); 

      return $out; 

을하지만이 업로드 될 때마다 하나 개의 이미지에 대한 모든 이미지의 주석을 보냅니다

var footerTemplate = '<div class="file-thumbnail-footer">\n' + 
     ' <div style="margin:5px 0">\n' + 
     '  <input class="form-control input-sm text-center {TAG_CSS_NEW}" value="{comments}" name="comment[]" type="text" placeholder="Enter Details...">\n' + 
     ' </div>\n' + 
     ' <div style="margin:15px 0 5px 0px"><samp><small class="file_name">{caption}</small></samp></div>\n' + 
     ' {size}\n' + 
     ' {progress} {actions}\n' + 
     '</div>'; 


layoutTemplates: { 
        footer: footerTemplate, size: '<samp><small>({sizeText})</small></samp>', 
        actionUpload: '<button type="button" class="kv-file-upload {uploadClass}" style="display:none;" title="{uploadTitle}">{uploadIcon}</button>\n', 
        actionZoom: '<button type="button" class="kv-file-zoom {zoomClass}" style="display:none;" title="{zoomTitle}">{zoomIcon}</button>', 
       }, 

나는 uploadExtraData를 사용하려고했다.

내 데이터베이스를 주석으로 업데이트하고 싶지만 파일 입력에 10 개의 이미지를 드래그하면 데이터베이스가 100 개의 업데이트/요청을 게시하고 10 개의 댓글이 10 번 게시됩니다.

감사합니다 :)

Answer 1

당신은 uploadExtraData

... 
    ...    
       ], 
       uploadExtraData: function(previewId, index) { 


        return { 
           key: index, 
           previewId: previewId, 
           comment: $("#comment").val(), 
           userid: <?=$userId;?>, 
           jobid: <?=$jobId;?> 
          }; 

       } 
... 
... 

에 콜백 기능을 사용할 수 있습니다 도와주세요