Add example demonstrating multiple file upload functionality

Copilot · ringabout · Copilot · commit 8693cd0ed36c · 2026-01-10T07:52:21.000Z
Co-authored-by: ringabout &lt;43030857+ringabout@users.noreply.github.com&gt;
diff --git a/examples/multifile_upload/README.md b/examples/multifile_upload/README.md
@@ -0,0 +1,42 @@
+# Multiple File Upload Example
+
+This example demonstrates how to handle multiple file uploads from a single HTML input element using Prologue's new `getUploadFiles` API.
+
+## What's New
+
+Prologue now supports retrieving multiple files uploaded from a single input element with the `multiple` attribute. 
+
+### New API
+
+- **`getUploadFiles(name: string): seq[UploadFile]`**: Returns all uploaded files with the given input name
+- **`getUploadFile(name: string): UploadFile`**: Returns the first uploaded file (backward compatible)
+
+## HTML Form
+
+```html
+<form method="post" action="/upload" enctype="multipart/form-data">
+    <input type="file" name="files" multiple />
+    <input type="submit" value="Upload" />
+</form>
+```
+
+## Handler Code
+
+```nim
+proc uploadFiles(ctx: Context) {.async.} =
+  let files = ctx.getUploadFiles("files")
+  
+  for file in files:
+    echo "Filename: ", file.filename
+    echo "Size: ", file.body.len, " bytes"
+    # Optionally save the file
+    # file.save("uploads/")
+```
+
+## Running the Example
+
+```bash
+nim c -r examples/multifile_upload/app.nim
+```
+
+Then open your browser to `http://localhost:8080` and select multiple files to upload.
diff --git a/examples/multifile_upload/app.nim b/examples/multifile_upload/app.nim
@@ -0,0 +1,38 @@
+import ../../src/prologue
+import std/strformat
+
+proc uploadForm(ctx: Context) {.async.} =
+  ## Serve the HTML form for uploading multiple files
+  await ctx.staticFileResponse("examples/multifile_upload/upload.html", "")
+
+proc uploadFiles(ctx: Context) {.async.} =
+  ## Handle multiple file uploads from a single input element
+  let files = ctx.getUploadFiles("files")
+  
+  var response = "<html><head><title>Upload Results</title></head><body>"
+  response.add("<h1>Uploaded Files</h1>")
+  response.add(fmt"<p>Total files uploaded: {files.len}</p>")
+  response.add("<ul>")
+  
+  for i, file in files:
+    response.add(fmt"<li>File {i+1}: {file.filename} ({file.body.len} bytes)</li>")
+    # Optionally save each file
+    # file.save("uploads/")
+  
+  response.add("</ul>")
+  response.add("<a href='/'>Upload more files</a>")
+  response.add("</body></html>")
+  
+  resp response
+
+proc main() =
+  let settings = newSettings()
+  var app = newApp(settings)
+  
+  app.get("/", uploadForm)
+  app.post("/upload", uploadFiles)
+  
+  app.run()
+
+when isMainModule:
+  main()
diff --git a/examples/multifile_upload/upload.html b/examples/multifile_upload/upload.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Multiple File Upload Example</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            max-width: 600px;
+            margin: 50px auto;
+            padding: 20px;
+        }
+        .upload-form {
+            border: 2px dashed #ccc;
+            border-radius: 10px;
+            padding: 30px;
+            text-align: center;
+        }
+        input[type="file"] {
+            margin: 20px 0;
+        }
+        input[type="submit"] {
+            background-color: #4CAF50;
+            color: white;
+            padding: 10px 20px;
+            border: none;
+            border-radius: 4px;
+            cursor: pointer;
+            font-size: 16px;
+        }
+        input[type="submit"]:hover {
+            background-color: #45a049;
+        }
+    </style>
+</head>
+<body>
+    <h1>Multiple File Upload Example</h1>
+    <div class="upload-form">
+        <h2>Select Multiple Files</h2>
+        <form method="post" action="/upload" enctype="multipart/form-data">
+            <input type="file" name="files" multiple required />
+            <br>
+            <input type="submit" value="Upload Files" />
+        </form>
+    </div>
+    <p><strong>Note:</strong> You can select multiple files at once using Ctrl+Click (or Cmd+Click on Mac) in the file picker dialog.</p>
+</body>
+</html>
