Question

我想在自定义模块中添加Media Gallery Uploader（如产品图片上传器）。我搜索了很多，但无法获得有关它的适当信息。我找到https://magento.stackexchange.com/questions/21161/using-the-magento-image-uploader-in-custom-module并尝试了很多但是无法取得成功。

Answer 1

我还制作了一个自定义模块，用于上传多张图片。

您需要首先调用自定义javascript文件，您需要将此文件上传到您的皮肤文件夹：

使用此js代码：

var abc = 0; //Declaring and defining global increement variable

$(document).ready(function() {

//To add new input file field dynamically, on click of "Add More Files" button below function will be executed
 $('#add_more').click(function() {
 $(this).before($("<div/>", {id: 'filediv'}).fadeIn('slow').append(
 $("<input/>", {name: 'file[]', type: 'file', id: 'file'}),
 $("<br/><br/>")
 ));
 });

//following function will executes on change event of file input to select different file
$('body').on('change', '#file', function(){
 if (this.files && this.files[0]) {
 abc += 1; //increementing global variable by 1

 var z = abc - 1;
 var x = $(this).parent().find('#previewimg' + z).remove();
 $(this).before("<div id='abcd"+ abc +"' class='abcd'><img id='previewimg" + abc + "' src=''/></div>");

 var reader = new FileReader();
 reader.onload = imageIsLoaded;
 reader.readAsDataURL(this.files[0]);

 $(this).hide();
 $("#abcd"+ abc).append($("<img/>", {id: 'img', src: 'http://yoursite.com/skin/frontend/yourtheme/default/images/ico-delete.png', alt: 'delete'}).click(function() {
 $(this).parent().parent().remove();
 }));
 }
 });

//To preview image
 function imageIsLoaded(e) {
 $('#previewimg' + abc).attr('src', e.target.result);
 };

 $('#upload').click(function(e) {
 var name = $(":file").val();
 if (!name)
 {
 alert("Debe subir una imagen en el primer cuadro");
 e.preventDefault();
 }
 });
});

然后在主题中添加表单：

<form enctype="multipart/form-data" action="<?php echo  Mage::getUrl('yourmodule/yourindexaction'); ?>" method="post">
<p>Only JPEG,PNG,JPG.</p> 
 <div id="filediv"><input name="file[]" type="file" id="file"/></div><br/>
 <input name="form_key" type="hidden" value="<?php echo Mage::getSingleton('core/session')->getFormKey() ?>" />
 <input type="button" id="add_more" class="upload" value="Add more images"/>
 <input type="submit" value="Upload" name="submit" id="upload" style="cursor: pointer;" class="upload"/>
 </form>

请注意表单操作我调用自定义模块的操作方法，在该操作上，您将获得帖子字段并处理字段。

然后循环所有图像，请在模块的操作中执行此操作：

for ($i = 0; $i < count($_FILES['file']['name']); $i++) {//loop to get individual element from the array

请参阅此网站以获取更多信息：http://www.formget.com/upload-multiple-images-using-php-and-jquery/

我希望这会有所帮助，让我知道任何问题......

自定义模块中的Magento Media Gallery Uploader

1 个答案: