【www.bbyears.com--php常用代码】
表单是网站常用的，不可缺少的。而通过表单建立图片上传也是刚需，基本每个网站都需要图片上传功能，现在比较流行的是直接无刷新上传图片，无刷新上传图片在drupal7 如何做呢？下面代码就是实现此功能。
方法1：用file原件配合ajax参数实现：
function testmodule_forma($form, &$form_state){
$form['im-container'] = array(
'#prefix'=>'',
'#suffix'=>'',
);
$form['image_file'] = array(
'#type' => 'file',
);
$form['upload'] = array(
'#type' => 'submit',
'#value' => 'upload',
'#submit' => array('upload_image'),
'#ajax'=> array(
'callback'=>'upload_image',
'wrapper'=> 'im-area',
'method'=> 'replace',
'effect'=> 'fade',
),
);
return $form;
}
function upload_image($form, $form_state){
$file = file_save_upload('image_file', array('file_validate_extensions' => array('png gif jpg jpeg')), "public://",$replace = FILE_EXISTS_REPLACE);
if ($file)
{
$file->status=FILE_STATUS_PERMANENT;
file_save($file);
$form['im-container']=array(
'#title'=>t('Preview:'),
'#prefix'=>'',
'#markup'=>'filename.'" height="250" width="250" />',
'#suffix'=>'',
);
}
else {
drupal_set_message('No file uploaded.');
}
return $form['im-container'];
}
方法2：直接使用 manage_file 原件实现：
上面的方式是需要配一个上传按钮，然而在drupal 7 有一个更好的表单原件 manage_file，可以通过manage_file实现无刷新上传。
$form['image_example_image_fid'] = array(
'#title' => t('Image'),
'#type' => 'managed_file',
'#description' => t('The uploaded image will be displayed on this page using the image style choosen below.'),
'#default_value' => variable_get('image_example_image_fid', ''),
'#upload_location' => 'public://image_example_images/',
);
方法3：使用manage_file 原件 配合js 实现不需要点击上传按钮直接上传：
上面两种方式都可以实现无刷新上传，但界面并不友好，两种方式都是需要点击上传按钮才触发上传，我们更多时候是不想有上传按钮，下面这个方式就可以做到：
File: auto_upload.info
name = Auto Upload description = Removes the need for users to press the 'Upload' button for AJAX file uploads. core = 7.x dependencies[] = file
File: auto_upload.js:
(function ($) {
Drupal.behaviors.autoUpload = {
attach: function (context, settings) {
$('form', context).delegate('input.form-file', 'change', function() {
$(this).next('input[type="submit"]').mousedown();
});
}
};
})(jQuery);
File: auto_upload.module
function auto_upload_init() {
drupal_add_js(drupal_get_path('module', 'auto_upload') . '/auto_upload.js');
}
我们还可以再优化下，让上传图片时候，显示缩略图：
format;
$field_name = $instance['field_name'];
$item =& $items[$delta];
switch($instance['widget']['type']) {
case 'multifield_base_widget':
$element['img1_upload'] = array(
'#title' => t('Image'),
'#type' => 'managed_file',
'#upload_location' => 'public://multifield_images/',
'#default_value' => isset($item['img1_upload']) ? $item['img1_upload'] : 0,
// assign #theme directly to the managed_file in other case it won't be
// rebuilt after file upload
'#theme' => 'image_multifield_multitype',
);
}
return $element;
}
/**
* Implements hook_theme().
*/
function multifield_theme() {
return array(
'image_multifield_multitype' => array(
'render element' => 'element',
),
);
}
/**
* Returns HTML for a managed file element with thumbnail.
*/
function theme_image_multifield_multitype($variables) {
$element = $variables['element'];
$output = '';
if($element['fid']['#value'] != 0) {
// if image is uploaded show its thumbnail to the output HTML
$output .= '';
//$output .= theme('image_style', array('style_name' => 'thumbnail', 'path' => file_load($element['fid']['#value'])->uri, 'getsize' => FALSE));
$output .= 'uri). '" class="thumbnail"/>';
$output .= drupal_render_children($element); // renders rest of the element as usual
$output .= '';
}
return $output; // of course, has to be returned back
}
?>
方法4：用第三方模块
还有一种方式比较简单直接，就是直接用第三方模块，例如Drag & Drop Upload 模块，就能实现无刷新上传，并且还支持拖拽，挺好的。