Skip to main content

Drag & Drop Image Upload

Purpose​

Drag & Drop Image Upload supplies two backend field widgets: a single-image uploader and a gallery uploader for related image records. They support dropping files onto a configured form, selecting files, previews and image removal.

Installation makes the widgets available to view designers. It does not automatically replace product images in the reviewed package: the example product-view file is not loaded by its manifest. There is no standalone upload menu.

Before you start​

Install eis_drag_drop for your exact Odoo version. The reviewed 19.0 package depends on Base Setup, Base, Web and Product. It does not require Enterprise. Use hosting that permits custom addons.

A developer or administrator responsible for form views must apply the widget to suitable existing fields. The example product gallery additionally relies on the native eCommerce product-image model and views; website_sale is not a default dependency of this addon.

This guide follows source inspection of 19.0. No upload or browser test was performed in this review.

Access and roles​

The addon defines no new business role or ACL grant. Users need their normal access to read and write the parent record and to create or remove the related image records. Server operations use the caller's ORM environment, so native model access still applies. Have the integrator verify read-only form states before rollout: the supplied gallery controls do not consistently disable changes based on a view's read-only flag.

Changing view definitions is an administrator/developer task. Uploaders should use the configured business form, rather than technical attachment methods.

Setup and menu​

For a single binary image field, the registered widget is d_and_d_image. For example, a maintained inherited form can use:

<field name="image_1920" widget="d_and_d_image"
       options="{'image_size': '100x100', 'preview_image': 'image_128'}"/>

The actual model must have those image fields. image_size controls the display dimensions; it does not establish an upload size limit.

For a one-to-many image gallery, use d_and_d_images on the appropriate relation and configure childImageField. The related model must support the image field and a name, plus any required fields supplied through the integration's defaults or extraData. previewImage selects a smaller preview and showConfirm controls the unsaved-record confirmation. Have the integrator validate these against the actual child model.

Workflow​

  1. Open the business record on a form where the widget has been configured. Save the record and resolve required fields before uploading a gallery.
  2. For a single image, drop an image onto the image area or use its upload/edit control. Inspect the preview, then save the form's change.
  3. For a gallery, drop several image files onto the drop area or select them with the upload control. The client prepares related image records and reloads the parent after its server request.
  4. Inspect the resulting tiles and reopen the record to confirm persistence. Gallery upload can save other unsaved parent changes first; review those changes before using it.
  5. Use the image or tile removal control only for an image you intend to remove. Gallery removal unlinks the child relation through the parent; the final deletion behavior depends on that relation's native model definition.
  6. Use the single-image preview/download controls when offered to inspect the original image rather than only its small preview.

Practice scenario​

On an authorized test form, create fictional product “Harbor Carry Case” and save it. Drop a small sample image into the configured main image field, save and reopen. Then upload two test gallery images and check both tiles after reopening. Remove one test image and check that the other remains. This exercise is source-derived and has not been run here.

Troubleshooting and limitations​

Nothing changed after installation: configure the form field. The bundled product example is not installed automatically.

No valid image files found: the gallery drag-and-drop path filters files by their image MIME type. Use an actual image supported by the browser.

Upload appears to finish but an image is absent: verify the saved parent, mandatory child fields and write/create permissions. The server helper can return a failure without a detailed client error, so reopening and checking the saved images is part of the workflow.

The source does not establish virus scanning, a configured maximum upload size, image rights clearance, or offline queueing. Confirm your form integration before using large batches.

Catalogue-qualified versions are 16.0–19.0. All inspected manifests leave the product example disabled. Odoo 19.0 adds guarded form processing and avoids inserting a duplicate gallery helper field; older versions have different frontend and view integrations. Their full workflows were not reviewed here.