Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/php/250.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Php Blueimp jQuery文件上传,传递额外表单数据_Php_Jquery_Xml_Forms_File Upload - Fatal编程技术网

Php Blueimp jQuery文件上传,传递额外表单数据

Php Blueimp jQuery文件上传,传递额外表单数据,php,jquery,xml,forms,file-upload,Php,Jquery,Xml,Forms,File Upload,我需要一些帮助。。。我已经设法让blueimp jQuery文件上传为我工作,但我在这方面肯定还是个新手,我对jQuery等知之甚少,所以请尽量给我清晰简单的介绍。我会尽量说得具体一些 好的。。。我想要实现的是,人们可以上传照片,并在每张照片上选择其他选项(通过下拉菜单)和添加额外细节(通过文本输入框)。这些附加表单字段将与上载的文件数组一起以数组形式传递。每个文件名及其相应的菜单选择和详细信息最终将与上传的照片一起存储在动态生成的XML或文本文件中 我知道类似的问题以前在github上也出现过

我需要一些帮助。。。我已经设法让blueimp jQuery文件上传为我工作,但我在这方面肯定还是个新手,我对jQuery等知之甚少,所以请尽量给我清晰简单的介绍。我会尽量说得具体一些

好的。。。我想要实现的是,人们可以上传照片,并在每张照片上选择其他选项(通过下拉菜单)和添加额外细节(通过文本输入框)。这些附加表单字段将与上载的文件数组一起以数组形式传递。每个文件名及其相应的菜单选择和详细信息最终将与上传的照片一起存储在动态生成的XML或文本文件中

我知道类似的问题以前在github上也出现过,我也见过类似的解决方案(https://github.com/blueimp/jQuery-File-Upload/wiki/How-to-submit-additional-Form-Data)但我使用的是最新版本的插件,在我的任何文件中都找不到与之等效的代码

到目前为止,我补充说:

<td><b>Package:</b> 
<select name="package[]"><option value="0">Basic</option><option value="1">Advanced</option><option value="2">Restoration</option></select>
</td>
<td>
<input type="text" name="notes[]">
</td>
包:
基底骨修复
在index.html文件中(在“删除”按钮代码之后),并将关闭表单标记移动到模板上载脚本之后,以包含这些字段。我知道这没有多大进展

下面是index.html的大部分内容

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/themes/base/jquery-ui.css" id="theme">
<link rel="stylesheet" href="../jquery.fileupload-ui.css">
<link rel="stylesheet" href="style.css">
<h2>File Upload</h2>
<div id="fileupload">
    <form action="upload.php" method="POST" enctype="multipart/form-data">
        <div class="fileupload-buttonbar">
            <label class="fileinput-button">
            <span>Add files...</span>
            <input type="file" name="files[]" multiple>
        </label>
        <button type="submit" class="start">Start upload</button>
        <button type="reset" class="cancel">Cancel upload</button>
        <button type="button" class="delete">Delete files</button>
    </div>
//</form> originally here, moved below
<div class="fileupload-content">
    <table class="files"></table>
    <div class="fileupload-progressbar"></div>
</div>
</div>
<script id="template-upload" type="text/x-jquery-tmpl">
<tr class="template-upload{{if error}} ui-state-error{{/if}}">
    <td class="preview"></td>
    <td class="name">${name}</td>
    <td class="size">${sizef}</td>
    {{if error}}
        <td class="error" colspan="2">Error:
            {{if error === 'maxFileSize'}}File is too big
            {{else error === 'minFileSize'}}File is too small
            {{else error === 'acceptFileTypes'}}Filetype not allowed
            {{else error === 'maxNumberOfFiles'}}Max number of files exceeded
            {{else}}${error}
            {{/if}}
        </td>
    {{else}}
        <td class="progress"><div></div></td>
        <td class="start"><button>Start</button></td>
    {{/if}}
    <td class="cancel"><button>Cancel</button></td>
</tr>
</script>
<script id="template-download" type="text/x-jquery-tmpl">
<tr class="template-download{{if error}} ui-state-error{{/if}}">
    {{if error}}
        <td></td>
        <td class="name">${name}</td>
        <td class="size">${sizef}</td>
        <td class="error" colspan="2">Error:
            {{if error === 1}}File exceeds upload_max_filesize (php.ini directive)
            {{else error === 2}}File exceeds MAX_FILE_SIZE (HTML form directive)
            {{else error === 3}}File was only partially uploaded
            {{else error === 4}}No File was uploaded
            {{else error === 5}}Missing a temporary folder
            {{else error === 6}}Failed to write file to disk
            {{else error === 7}}File upload stopped by extension
            {{else error === 'maxFileSize'}}File is too big
            {{else error === 'minFileSize'}}File is too small
            {{else error === 'acceptFileTypes'}}Filetype not allowed
            {{else error === 'maxNumberOfFiles'}}Max number of files exceeded
            {{else error === 'uploadedBytes'}}Uploaded bytes exceed file size
            {{else error === 'emptyResult'}}Empty file upload result
            {{else}}${error}
            {{/if}}
        </td>
    {{else}}
        <td class="preview">
            {{if thumbnail_url}}
                <a href="${url}" target="_blank"><img src="${thumbnail_url}"></a>
            {{/if}}
        </td>
        <td class="name">
            <a href="${url}"{{if thumbnail_url}} target="_blank"{{/if}}>${name}</a>
        </td>
        <td class="size">${sizef}</td>
        <td colspan="2"></td>
    {{/if}}
    <td class="delete">
        <button data-type="${delete_type}" data-url="${delete_url}">Delete</button>
    </td>
<td><b>Package:</b> 
<select name="package[]"><option value="0">Basic</option><option value="1">Advanced</option><option value="2">Restoration</option></select>
</td>
<td>
<input type="text" name="notes[]">
</td>
</tr>
</script>
</form>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>
<script src="../jquery.iframe-transport.js"></script>
<script src="../jquery.fileupload.js"></script>
<script src="../jquery.fileupload-ui.js"></script>
<script src="application.js"></script>

文件上传
添加文件。。。
开始上传
取消上传
删除文件
//原来在这里,搬到下面
${name}
${sizef}
{{if error}}
错误:
{{if error==='maxFileSize'}}文件太大
{{else error==='minFileSize'}}文件太小
{else error==='acceptFileTypes'}}不允许使用文件类型
{{else error==='maxNumberOfFiles'}}超过了最大文件数
{{else}}${error}
{{/if}
{{else}
开始
{{/if}
取消
{{if error}}
${name}
${sizef}
错误:
{{if error==1}}}文件超过了upload\u max\u filesize(php.ini指令)
{{else error==2}}文件超过了最大文件大小(HTML表单指令)
{{else error==3}}文件仅部分上载
{{else error==4}}未上载任何文件
{{else error==5}}缺少临时文件夹
{{else error==6}}无法将文件写入磁盘
{{else error==7}}文件上载已被扩展名停止
{{else error==='maxFileSize'}}文件太大
{{else error==='minFileSize'}}文件太小
{else error==='acceptFileTypes'}}不允许使用文件类型
{{else error==='maxNumberOfFiles'}}超过了最大文件数
{{else error==='uploadedBytes'}}上载的字节超过了文件大小
{{else error==='emptyResult'}}空文件上载结果
{{else}}${error}
{{/if}
{{else}
{{如果缩略图{u url}}
{{/if}
${sizef}
{{/if}
删除
包裹:
基底骨修复
不过,我对upload.php、文件[]数组的解析位置以及文件名等没有太多的了解,也不确定在哪里接收包[]和notes[]数组,遍历它们,以及如何将所有信息放入文本/XML文件中


有没有人能耐心地和有经验地使用这个插件/这些问题来指导我完成下一步的工作?非常感谢您的帮助。

在upload.php中-要查找您要查找的参数,请尝试检查全局变量$\u REQUEST、$\u GET或$\u POST

因此,例如,如果要将“package[]”参数发送到upload.php,则可以使用$_REQUEST['package[]”在upload.php中访问它


希望这有帮助。

我发现此资源有助于通过上传的文件传递额外的表单数据:


很抱歉,我没有时间写更详细的答案。

要传递额外的表单数据,您可以执行类似的操作:

    $('[name=files\\[\\]]').fileupload({
        //...your initialization of the file uploader here
    }).bind('fileuploadsubmit', function (e, data) {
        data.formData = {
            'package': $('[name=package\\[\\]]').val(),
            'notes': $('[name=notes\\[\\]]').val()
        };
    });
在PHP端,您可以在$u POST数组中查找提交的“包”和 notes的数据


如果提交的数据不是数组数据(如提交多个值的复选框),我将避免在表单元素名称中使用“[]”。

我还需要传递一个额外的参数,并发现可以使用该参数以编程方式设置其他表单数据

$('#fileupload').fileupload({
    formData: {
                    param1: 'test'
                    ,param2: "value2"
                    ,param3: "yasseshaikh"
              }
});

来源:

我遇到了这个问题。。但是你帮我整理了一下,谢谢你@jasonjonesutahc注意:如果上传的文件大于
post\u max\u size
upload\u max\u filesize
(在php.ini中),你的表单数据可能会丢失。您还应该始终添加
maxChunkSize
-参数(例如
maxChunkSize:10*1024*1024
),以便将大文件拆分为包含formData的10MB小数据块。有人问(在现已删除的注释中)为什么我回答这个问题,并提供了指向OP在其原始问题中包含的资源的链接。鉴于这个问题很久以前就得到了回答,我只能猜测,我在最初回答时忽略了这一点。我将在这里留下我的答案,因为它似乎对一些获得投票权的人有价值(可能是因为它使资源更加可见)。