Question

我最近开展了一个项目来创建一个简单的多文件上传系统，您可以在其中为每个上传的文件分配标题。现在我被推荐使用Blueimp的jQuery File上传器，因为它提供了拖放功能。

所以这里是我感到困惑的地方。我查看了Blueimp在GitHub Link here上给出的教程或描述。我可以添加一个额外的字段，但这适用于上传的所有文件。（我使用CodeIgniter来处理文件到DB）。

那么我该如何为每个添加的文件添加个人标题呢？因为我无法理解github上的啧啧。（也许是一个jsfiddle例子，我可以离开学习？）

编辑*

现在我已经设法添加额外的输入框...最后添加相当简单（doh！）。这就是我在index.html文件中的内容

<script id="template-upload" type="text/x-tmpl">
{% for (var i=0, file; file=o.files[i]; i++) { %}
    <tr class="template-upload fade">
        <td>
            <span class="preview"></span>
        </td>
        <td>
            <p class="name">{%=file.name%}</p>
            {% if (file.error) { %}
                <div><span class="label label-important">Error</span> {%=file.error%}</div>
            {% } %}
        </td>
        <td class="title"><label>File Title: <input name="title[]" required="required"></label></td>
        <td>
            <p class="size">{%=o.formatFileSize(file.size)%}</p>
            {% if (!o.files.error) { %}
                <div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"><div class="bar" style="width:0%;"></div></div>
            {% } %}
        </td>
        <td>
            {% if (!o.files.error && !i && !o.options.autoUpload) { %}
                <button class="btn btn-primary start">
                    <i class="icon-upload icon-white"></i>
                    <span>Start</span>
                </button>
            {% } %}
            {% if (!i) { %}
                <button class="btn btn-warning cancel">
                    <i class="icon-ban-circle icon-white"></i>
                    <span>Cancel</span>
                </button>
            {% } %}
        </td>
    </tr>
{% } %}
</script>

我还将它添加到main.js文件的底部

$('#fileupload').bind('fileuploadsubmit', function (e, data) {
    var inputs = data.context.find(':input');
    if (inputs.filter('[required][value=""]').first().focus().length) {
        return false;
    }
    data.formData = inputs.serializeArray();

我的下一个问题是如何将标题分配为文件名？

Answer 1

只需添加不带扩展名的file.name作为文本字段的值。

＆＃13;

<td class="title"><label>File Title: <input name="title[]" value="{%= file.name.split('/').pop().split('.').shift()%}"  required="required"></label></td>

＆＃13;

BlueImp jQuery FIle Upload - 向每个文件添加附加数据

1 个答案: