Forms 如何以TYPO3 v9.5的形式进行多重上传?
因为我使用的是TYPO3 v9.5.3,希望使用sysext“表单”,但无法通过邮件接受和发送多个上传 到目前为止我所做的: 覆盖标准.yaml文件Forms 如何以TYPO3 v9.5的形式进行多重上传?,forms,file-upload,typo3,image-uploading,typo3-9.x,Forms,File Upload,Typo3,Image Uploading,Typo3 9.x,因为我使用的是TYPO3 v9.5.3,希望使用sysext“表单”,但无法通过邮件接受和发送多个上传 到目前为止我所做的: 覆盖标准.yaml文件 plugin.tx_form { settings { yamlConfigurations { 100 = fileadmin/Form/CustomFormSetup.yaml } } } 为“ImageUpload.html”创建了一个新的模板文件,并添加了: mult
plugin.tx_form {
settings {
yamlConfigurations {
100 = fileadmin/Form/CustomFormSetup.yaml
}
}
}
为“ImageUpload.html”创建了一个新的模板文件,并添加了:
multiple="multiple"
现在看起来是这样的:
<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:formvh="http://typo3.org/ns/TYPO3/CMS/Form/ViewHelpers" data-namespace-typo3-fluid="true">
<formvh:renderRenderable renderable="{element}">
<f:render partial="Field/Field" arguments="{element: element}" contentAs="elementContent">
<formvh:form.uploadedResource
property="{element.identifier}"
as="image"
multiple="multiple"
id="{element.uniqueIdentifier}"
class="{element.properties.elementClassAttribute}"
errorClass="{element.properties.elementErrorClassAttribute}"
additionalAttributes="{formvh:translateElementProperty(element: element, property: 'fluidAdditionalAttributes')}"
accept="{element.properties.allowedMimeTypes}"
>
<f:if condition="{image}">
<div id="{element.uniqueIdentifier}-preview">
<a href="{f:uri.image(image: image, maxWidth: element.properties.imageLinkMaxWidth)}" class="{element.properties.elementClassAttribute}">
<f:image image="{image}" maxWidth="{element.properties.imageMaxWidth}" maxHeight="{element.properties.imageMaxHeight}" alt="{formvh:translateElementProperty(element: element, property: 'altText')}" />
</a>
</div>
</f:if>
</formvh:form.uploadedResource>
</f:render>
</formvh:renderRenderable>
</html>
因为现在我也看到按钮变成了复数版本,我现在可以在前端选择多个文件
什么问题仍然存在:
当我选择多个文件并发送表单(然后结果通过邮件发送)时,邮件包含除上传之外的所有内容。
当切换回单一上传版本时,除了一张图片外,一切都正常
有人能帮我吗?
当我有多个图像/上传时,我必须做什么才能使表单处理这些图像/上传
我也读了这篇文章,但它没有解决我的问题,因为我想在标准表单扩展中解决这个问题。添加“多个”属性将使文件选择器能够选择多个文件。但是您需要扩展viewhelper“formvh:form.uploadedResource”来处理这些多个文件 甚至您也可以添加自己的viewhelper来实现您想要对上传的文件执行的操作 谢谢
此线程有点旧,但我在2020年仍面临同样的问题,并决定发布解决方案。如果任何有经验的Typo3开发人员能够纠正/补充我的答案,这将是非常棒的
<?php
namespace YOUREXTKEY\Domain\Model;
use TYPO3\CMS\Form\Domain\Model\FormElements\GenericFormElement;
class MultipleUpload extends GenericFormElement
{
}
<?php
namespace YOUREXTKEY\Finishers;
use TYPO3\CMS\Form\Domain\Model\FormElements\FileUpload;
use TYPO3\CMS\Form\Domain\Finishers\EmailFinisher;
use YOUREXTKEY\Domain\Model\MultipleUpload;
use TYPO3\CMS\Form\Service\TranslationService;
use TYPO3\CMS\Core\Mail\MailMessage;
/**
* Class MultipleUploadsFinisher
*/
class MultipleUploadsFinisher extends EmailFinisher {
/**
* Executes this finisher
* @see AbstractFinisher::execute()
*/
protected function executeInternal()
{
... copied code from EmailFinisher
if ($attachUploads) {
foreach ($elements as $element) {
if (!$element instanceof MultipleUpload) {
continue;
}
$files = $formRuntime[$element->getIdentifier()];
foreach ($files as $file) {
if ($file) {
$target_path = \TYPO3\CMS\Core\Utility\GeneralUtility::getFileAbsFileName('fileadmin/user_upload/') . basename($file['name']);
if (move_uploaded_file($file['tmp_name'], $target_path) ) {
$mail->attach(\Swift_Attachment::fromPath($target_path));
}
// unlink($target_path); (if you wish to delete uploads, uncomment this line)
}
}
}
}
... copied code from EmailFinisher
}
}
<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:formvh="http://typo3.org/ns/TYPO3/CMS/Form/ViewHelpers" data-namespace-typo3-fluid="true">
<formvh:renderRenderable renderable="{element}">
<f:render partial="Field/Field" arguments="{element: element}" contentAs="elementContent">
<div class="form-file-wrapper ">
<f:form.upload property="{element.identifier}" multiple="multiple" id="{element.uniqueIdentifier}" additionalAttributes="{multiple : '', accept : 'YOURMIMETYPES'}"/>
<label for="{element.uniqueIdentifier}">
YOUR LABEL TEXT HERE
</label>
</div>
</f:render>
</formvh:renderRenderable>
</html>
您的标签文本在这里
<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:formvh="http://typo3.org/ns/TYPO3/CMS/Form/ViewHelpers" data-namespace-typo3-fluid="true">
<formvh:renderRenderable renderable="{element}">
<f:render partial="Field/Field" arguments="{element: element}" contentAs="elementContent">
<div class="form-file-wrapper ">
<f:form.upload property="{element.identifier}" multiple="multiple" id="{element.uniqueIdentifier}" additionalAttributes="{multiple : '', accept : 'YOURMIMETYPES'}"/>
<label for="{element.uniqueIdentifier}">
YOUR LABEL TEXT HERE
</label>
</div>
</f:render>
</formvh:renderRenderable>
</html>
// Resources/Public/JavaScript/Backend/FormEditor/MultipleUploadViewModel.js
define([
'jquery',
'TYPO3/CMS/Form/Backend/FormEditor/Helper'
], function ($, Helper) {
'use strict';
return (function ($, Helper) {
/**
* @private
*
* @var object
*/
var _formEditorApp = null;
/**
* @private
*
* @return object
*/
function getFormEditorApp() {
return _formEditorApp;
};
/**
* @private
*
* @return object
*/
function getPublisherSubscriber() {
return getFormEditorApp().getPublisherSubscriber();
};
/**
* @private
*
* @return object
*/
function getUtility() {
return getFormEditorApp().getUtility();
};
/**
* @private
*
* @param object
* @return object
*/
function getHelper() {
return Helper;
};
/**
* @private
*
* @return object
*/
function getCurrentlySelectedFormElement() {
return getFormEditorApp().getCurrentlySelectedFormElement();
};
/**
* @private
*
* @param mixed test
* @param string message
* @param int messageCode
* @return void
*/
function assert(test, message, messageCode) {
return getFormEditorApp().assert(test, message, messageCode);
};
/**
* @private
*
* @return void
* @throws 1491643380
*/
function _helperSetup() {
assert('function' === $.type(Helper.bootstrap),
'The view model helper does not implement the method "bootstrap"',
1491643380
);
Helper.bootstrap(getFormEditorApp());
};
/**
* @private
*
* @return void
*/
function _subscribeEvents() {
/**
* @private
*
* @param string
* @param array
* args[0] = formElement
* args[1] = template
* @return void
*/
getPublisherSubscriber().subscribe('view/stage/abstract/render/template/perform', function (topic, args) {
if (args[0].get('type') === 'MultipleUpload') {
getFormEditorApp().getViewModel().getStage().renderSimpleTemplateWithValidators(args[0], args[1]);
}
});
};
/**
* @public
*
* @param object formEditorApp
* @return void
*/
function bootstrap(formEditorApp) {
_formEditorApp = formEditorApp;
_helperSetup();
_subscribeEvents();
};
/**
* Publish the public methods.
* Implements the "Revealing Module Pattern".
*/
return {
bootstrap: bootstrap
};
})($, Helper);
});
finishers:
-
options:
subject: 'YOUR EMAIL SUBJECT'
recipientAddress: YOUR EMAIL RECIPIENT
recipientName: ''
senderAddress: YOUR EMAIL SENDER
senderName: YOUR EMAIL SENDER NAME
replyToAddress: ''
carbonCopyAddress: ''
blindCarbonCopyAddress: ''
format: html
attachUploads: true
translation:
language: ''
templatePathAndFilename: 'EXT:YOUREXTKEY/Resources/Private/Templates/Forms/Email/Html.html'
identifier: MultipleUploadsFinisher
-
properties:
elementClassAttribute: 'col col-12 mt-3'
allowedMimeTypes:
- application/vnd.openxmlformats-officedocument.wordprocessingml.document
- application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
- application/pdf
- image/jpeg
- image/png
- text/plain
elementDescription: ''
type: MultipleUpload
identifier: fileupload-1
label: Files