magento自定义模块使用uploader上传文件,实现方法如下
1、在edit/form.php中添加代码:
<?
$fieldset->addField('images', 'note', array(
'label' => Mage::helper('review')->__('Review Image'),
//'required' => true,
'name' => 'images',
'text' => $this->getLayout()->createBlock('xreview/adminhtml_review_image_upload')->_toHtml(),
));
?>
2、新建block:silk/xreview/adminhtml/review/image/upload.php
<?
class Silk_Xreview_Block_Adminhtml_Review_Image_Upload extends Mage_Adminhtml_Block_Template
{
public function __construct()
{
parent::__construct();
$this->setTemplate('review/image/upload.phtml');
}
protected function _prepareLayout() {
//加载Uploader插件的js
$this->getLayout()->getBlock('head')->addJs('lib/flex.js');
$this->getLayout()->getBlock('head')->addJs('mage/adminhtml/flexuploader.js');
$this->getLayout()->getBlock('head')->addJs('lib/FABridge.js');
// 添加Mage_Adminhtml_Block_Media_Uploader子块Block
$this->setChild('uploader', $this->getLayout()->createBlock('adminhtml/media_uploader'));
$this->getChild('uploader')->getConfig()
// 文件上传处理action
->setUrl(Mage::getModel('adminhtml/url')->addSessionParam()->getUrl('xreview/adminhtml_xreview/upload'))
->setFileField('review_image')
->setFilters(array(
'images' => array(
'label' => Mage::helper('adminhtml')->__('Images (.gif, .jpg, .png)'),
'files' => array('*.gif', '*.jpg','*.jpeg', '*.png')
)
));
return parent::_prepareLayout();
}
}
?>
3、上一步,声明了blcok对应的phtml,所以新建design/adminhtml/default/default/template/review/image/upload.phtml:
<?php echo $this->getChildHtml('uploader')?>
以上步骤完成以后,就可以看见与产品edit页面image中的2个按钮了
4、新建controller:silk/xreview/controllers/adminhtml/xreviewController.php
<?
class Silk_Xreview_Adminhtml_XreviewController extends Mage_Adminhtml_Controller_Action
{
public function uploadAction()
{
try {
//Mage::log($_FILES,null,'file.log');
$uploader = new Mage_Core_Model_File_Uploader('review_image');
$uploader->setAllowedExtensions(array('jpg','jpeg','gif','png'));
$uploader->setAllowRenameFiles(true);
$uploader->setFilesDispersion(true);
$result = $uploader->save($this->getBaseTmpMediaPath());
Mage::dispatchEvent('catalog_product_gallery_upload_image_after', array(
'result' => $result,
'action' => $this
));
$result['tmp_name'] = str_replace(DS, "/", $result['tmp_name']);
$result['path'] = str_replace(DS, "/", $result['path']);
$result['url'] =$this->getTmpMediaUrl($result['file']);
$result['file'] = $result['file'];
$result['cookie'] = array(
'name' => session_name(),
'value' => $this->_getSession()->getSessionId(),
'lifetime' => $this->_getSession()->getCookieLifetime(),
'path' => $this->_getSession()->getCookiePath(),
'domain' => $this->_getSession()->getCookieDomain()
);
} catch (Exception $e) {
$result = array(
'error' => $e->getMessage(),
'errorcode' => $e->getCode());
}
//Mage::log($result,null,'cookie.log');
$this->getResponse()->setBody(Mage::helper('core')->jsonEncode($result));
}
private function getBaseTmpMediaPath() {
return Mage::getBaseDir('media') . DS . 'review';
}
private function getTmpMediaUrl($file) {
$file = str_replace(DS, '/', $file);
if (substr($file, 0, 1) == '/') {
$file = substr($file, 1);
}
return Mage::getBaseUrl('media') . 'review/'. $file;
}
}
?>
5、如何处理action的json数据,在upload.phtml中,加入下面的js:
<script type="text/javascript">
//处理action中的json数据
var uploader = <?php echo $this->getChild('uploader')->getJsObjectName(); ?>;
uploader.onFilesComplete = function(files) {
var i = 0;
files.each(function(file) {
if(document.getElementById('upload_image_'+i)){
document.getElementById('upload_image_'+i).remove();
}
var str = file.response;
var json = eval('('+str+')');
//图片以隐藏域的方式提交
var input = document.createElement('input');
input.setAttribute('type', 'hidden');
input.setAttribute('value', json.file);
input.setAttribute('id', 'upload_image_'+i);
input.setAttribute('name', 'images[]');
document.getElementById('add_review_form').appendChild(input);
i++;
});
}
</script>
|