jQuery: मल्टी ड्रॉपज़ोन

Question

के साथ एक ड्रैग-एंड-ड्रॉप अपलोड मैं फ़ोल्डरों पर ड्रैग-एंड-ड्रॉप अपलोड के साथ फ़ोल्डर और फ़ाइलों का एक पेड़ विकसित करना चाहता हूं।

उदाहरण:

खींचें और ड्रॉप अपलोड के लिए, मैं jQuery File Upload निधि।

बुनियादी कोड है:

$('#fileupload').fileupload({ 
    dataType: 'json', 
    url: 'php/index.php', 
    dropZone: $(document), 
    done: function (e, data) { 
     $.each(data.result, function (index, file) { 
      $('<p/>').text(file.name).appendTo(document.body); 
     }); 
    } 
}); 

अपने प्रोजेक्ट में, मैं बहु dropzone (मेरे फ़ोल्डर) उदाहरण के लिए की तरह है:

<ul> 
    <li>Bookmarks</li> 
    <li>Search</li> 
    <li>Web dev</li> 
    ... 
</ul> 

को संभालने के लिए ऊपर कोड बदलने के लिए आईडी, कक्षा और jQuery चयनकर्ताओं के साथ बहु ड्रॉपज़ोन?

---

मैं कुछ इस तरह की कोशिश की लेकिन स्पष्ट रूप से यह काम नहीं करता:

<ul> 
    <li id="folder1" class="folder">Bookmarks</li> 
    <li id="folder2" class="folder">Search</li> 
    <li id="folder3" class="folder">Web dev</li> 
    ... 
</ul> 

।

$('.folder').fileupload({ 
    dataType: 'json', 
    url: 'php/index.php', 
    dropZone: $('.folder'), 
    done: function (e, data) { 
     $.each(data.result, function (index, file) { 
      $('<p/>').text($(this).attr(id)).appendTo(document.body); 
     }); 
    } 
}); 

मुद्दे:

• अपलोड 3 बार किया जाता है।
• $ (यह) मौजूद नहीं है।

Answer 1

मुझे एक सहयोगी के साथ समाधान मिला।

वास्तव में यह जटिल नहीं किया गया था:

$('.folder').each(function(){ 
     var $this = $(this); 

     $this.fileupload({ 
      dataType: 'json', 
      url: 'php/index.php', 
      dropZone: $this, 
      done: function (e, data) { 
       $.each(data.result, function (index, file) { 
        $('<p/>').text($this.attr('id')).appendTo(document.body); 
       }); 
      } 
     }); 
    }); 

संपादित करें: मेरा बुरा है, क्या यह उत्तर the documentation में था।