Skip to content
garmoncheg edited this page Jul 18, 2011 · 10 revisions

Django Multiuploader Plugin

Readme for plugin of Django Multiuploader using jQuery Plugin by Sebastian Tschan(https://blueimp.net/).

This is a plugin, made using multiupload form from Sebastian Tschan. It uses jQuey UI and jQuery instead of Flash uploader. On Django side it uses sorl-thumbnails and PIL. You can use it in your applications with simple inclusion tag

Requirements:

- PIL(Python Imaging Library) (for sorl)
- sorl-thumbnail's(http://thumbnail.sorl.net/) (for thumbnails generation)

Example usage:

Adding this AJAX form to your web site is as simple, as adding this 2 tag to your template:

{% load multiuploader %}
{% multiupform %}

Installation:

  1. Install an app. Do it by adding:

    'multiuploader',

string to your settings.py -> INSTALLED_APPS = () dictionary. Note that is has to have 'sorl.thumbnail', working already.

  1. Register urls in your root urlconf urls.py adding string to your urlpatterns like so :

    url(r'^$', 'app.views.image_view', name='main'),

  2. Copy or symlink files from plugins "media/" directory to your MEDIA_ROOT.

  3. Edit templates and styles to meet your needs. (Optional) (for e.g. changing the form design and/or behavior)

Settings:

You can override plugin behavior by adding those settings to your root settings.py:

File delete url to use in your app. default value is '/multi_delete/' MULTI_FILE_DELETE_URL = '/multi_delete/'

Url to show uploaded image, default is '/multi_image/' + key to identify image (about 80 characters long): MULTI_IMAGE_URL = '/multi_image/'

Folder to store uploaded pictures inside your MEDIA_ROOT folder MULTI_IMAGES_FOLDER = 'multiuploader_images/'

Model Usage:

Plugin stores Uploaded images to a simple model. It has some those fields:

  • "MultiuploaderImage.filename" CharField to store original (uploaded) file filename
  • "MultiuploaderImage.file" FileField to store file link to uploaded file in file system
  • "MultiuploaderImage.key_data" CharField with randomly generated key to use in your model
  • "MultiuploaderImage.upload_date" DateTimeField to store file upload data with auto now adding

You can use it directly in your code like so:

#views.py
def multi_show_uploaded(request, key):
    image = get_object_or_404(MultiuploaderImage, key_data=key)
    url = settings.MEDIA_URL+image.image.name
    return render_to_response('multiuploader/one_image.html', {"multi_single_url":url,})

And then in template:

#'multiuploader/one_image.html'
<img src="{{ multi_single_url }}">

I will not stop on model usage here for long. Fell free to ask me any questions appeared...

Development plans:

  • Add a way to specify which model to use to store files.
Clone this wiki locally