I have a requirement to have a form which allows for image uploading but I don't see any facility for doing that. I remember Codeigniter used to have a form_open_multipart that I think allowed image uploading and included an image uploader but I can't imagine how the image uploader provided from GitHub could be integrated into that. Any thoughts or have I missed something?
Mike
Image uploading
6 months ago
6 months ago
#1
6 months ago
#2
Good day, Mike. Allow me to expand on the excellent answer already provided.
The `form_open_upload()` helper is indeed the correct starting point — it generates a `<form>` tag with the `enctype="multipart/form-data"` attribute required for file submissions. However, image uploading in Trongate goes beyond just the form. The real power lies in the **Image module**, which handles validation, resizing, thumbnail generation, and security checks automatically.
Let me walk through a complete, working example.
---
## The Complete Image Uploader
### Step 1 — The Controller
Create `modules/gallery/Gallery.php` with three methods:
### Step 2 — The Upload Form View
Create `modules/gallery/views/upload_form.php`:
### Step 3 — The Success View
Create `modules/gallery/views/upload_success.php`:
### Step 4 — Create the Directories
From your application root:
---
## What the Image Module Does Automatically
When you call `$this->image->upload($config)`, Trongate handles all of the following for you:
| Concern | How It's Handled |
|---|---|
| **MIME validation** | Checks the actual file content, not just the extension |
| **File signatures** | Verifies JPEG/GIF/PNG/WEBP magic bytes to prevent spoofed uploads |
| **Embedded content scan** | Checks the first 256 bytes for script tags or PHP code |
| **Dimension enforcement** | Resizes images that exceed your `max_width` / `max_height` |
| **Aspect ratio preservation** | Maintains proportions during resizing |
| **Thumbnail generation** | Creates a separate smaller version automatically |
| **Duplicate naming** | Appends `_2`, `_3`, etc. if a file with the same name exists |
| **File sanitization** | Strips special characters, spaces become hyphens |
| **Memory check** | Refuses to process an image if it would exceed available memory |
You get all of this simply by passing a config array.
---
## Key Points to Remember
1. **`form_open_upload()`** replaces `form_open()` when your form includes a file input. It adds `enctype="multipart/form-data"`.
2. **Validation comes before upload.** Always call `set_rules()` and `run()` before `$this->image->upload()`.
3. **Use the Image module for images** (`$this->image->upload()`) and the File module for documents (`$this->file->upload()`). The Image module adds resizing, thumbnails, and image-specific security checks.
4. **POST-Redirect-GET pattern.** After a successful upload, redirect the user rather than rendering a view directly. This prevents accidental re-submission on page refresh.
5. **For simple file uploads** (PDFs, text files, etc.), use `$this->file->upload()` instead. The pattern is identical — the same form helpers and validation rules apply, just swap the module.
I hope this helps you get started. The documentation page on basic image uploading contains further details. In addition, there is a complete example module on GitHub at the following URL:
https://github.com/trongate/Trongate-v2---Simple-Image-Uploader
I encourage you to have a look at the above GitHub repository, should you wish to see it in action without typing everything out manually.
— Grady 🎩
The `form_open_upload()` helper is indeed the correct starting point — it generates a `<form>` tag with the `enctype="multipart/form-data"` attribute required for file submissions. However, image uploading in Trongate goes beyond just the form. The real power lies in the **Image module**, which handles validation, resizing, thumbnail generation, and security checks automatically.
Let me walk through a complete, working example.
---
## The Complete Image Uploader
### Step 1 — The Controller
Create `modules/gallery/Gallery.php` with three methods:
### Step 2 — The Upload Form View
Create `modules/gallery/views/upload_form.php`:
### Step 3 — The Success View
Create `modules/gallery/views/upload_success.php`:
### Step 4 — Create the Directories
From your application root:
---
## What the Image Module Does Automatically
When you call `$this->image->upload($config)`, Trongate handles all of the following for you:
| Concern | How It's Handled |
|---|---|
| **MIME validation** | Checks the actual file content, not just the extension |
| **File signatures** | Verifies JPEG/GIF/PNG/WEBP magic bytes to prevent spoofed uploads |
| **Embedded content scan** | Checks the first 256 bytes for script tags or PHP code |
| **Dimension enforcement** | Resizes images that exceed your `max_width` / `max_height` |
| **Aspect ratio preservation** | Maintains proportions during resizing |
| **Thumbnail generation** | Creates a separate smaller version automatically |
| **Duplicate naming** | Appends `_2`, `_3`, etc. if a file with the same name exists |
| **File sanitization** | Strips special characters, spaces become hyphens |
| **Memory check** | Refuses to process an image if it would exceed available memory |
You get all of this simply by passing a config array.
---
## Key Points to Remember
1. **`form_open_upload()`** replaces `form_open()` when your form includes a file input. It adds `enctype="multipart/form-data"`.
2. **Validation comes before upload.** Always call `set_rules()` and `run()` before `$this->image->upload()`.
3. **Use the Image module for images** (`$this->image->upload()`) and the File module for documents (`$this->file->upload()`). The Image module adds resizing, thumbnails, and image-specific security checks.
4. **POST-Redirect-GET pattern.** After a successful upload, redirect the user rather than rendering a view directly. This prevents accidental re-submission on page refresh.
5. **For simple file uploads** (PDFs, text files, etc.), use `$this->file->upload()` instead. The pattern is identical — the same form helpers and validation rules apply, just swap the module.
I hope this helps you get started. The documentation page on basic image uploading contains further details. In addition, there is a complete example module on GitHub at the following URL:
https://github.com/trongate/Trongate-v2---Simple-Image-Uploader
I encourage you to have a look at the above GitHub repository, should you wish to see it in action without typing everything out manually.
— Grady 🎩
HEADS UP: Grady is our friendly AI assistant. The above post is designed to help, but a quick double-check is always a smart move.
6 months ago
#3
Thanks so much guys, this has answered everything that I wanted to know. Probably should have known it before, but there we are.
6 months ago
#4
Congratulations to both Balazs and Grady on submitting excellent answers to Mike's query on image uploading.
The watch is fantastic, great choice DC and I wear it with a vibe of 'dual expectations' - calm and focus.
Grady, if you are reading this I would suggest that you substitute markdown with raw ASCII codes for human readability or DC I can send you a simple method I wrote to convert markdown to HTML and could be injected on the display forum module.
Cheers
The watch is fantastic, great choice DC and I wear it with a vibe of 'dual expectations' - calm and focus.
Grady, if you are reading this I would suggest that you substitute markdown with raw ASCII codes for human readability or DC I can send you a simple method I wrote to convert markdown to HTML and could be injected on the display forum module.
Cheers
6 months ago
#5
I agree, short and to the point then we can talk the details in chunks is more enjoyable and likely to stick better