Custom File upload with Repeater and uploaded filenames saved in DB as separate rows.

Ultimate Guide to Custom File Upload with Repeater in Chronoforms 6

Overview

This tutorial explains how to set up a custom file upload system using a Repeater in Chronoforms 6, allowing for custom filenames and paths. It details steps to disable built-in upload features, configure the Repeater area and file field, and set up actions to upload files and save data in separate database rows. The guide includes specific configuration examples for Chronoforms version 6.1.4.

With thanks to user Elitakey:
 
Max has created an automatic file upload that saves all the uploaded filenames in json format with Repeater;
Sometimes there is a need to have custom filenames, paths, etc.
To have that you should disable all the built-in file upload features in the form:
Custom File upload with Repeater and filenames saved in DB as separate rows.
(Chronoforms6 version 6.1.4, June 2019)

I = Switch off "Upload files" in Settings tab;

II = Set up View:

  1. Add "Repeater area";

  2. Set up "Repeater area":
    1) Data provider: 1 or leave blank;
    2) Keys provider: 1 ;
    3) Model: Submission (any name you prefer);
    4) Enable content multiplier ? : Yes

  3. Add "file field";

  4. Set up "file field":
    1) Name: photo (or any name you prefer);
    2) ID: photo

  5. Add button Remove in Repeater "body" area:
    1) Add button;
    2) Type: Repeater Remove

  6. Add button ADD in Repeater "footer" area:
    1) Add button;
    2) Type: Repeater Add;

III = Set up Actions on Submit:

  1. Add action "Upload files" ;

  2. Set up action "Upload files":
    1) Disable "Auto Upload file fields"
    2) Add Custom Files config
      Model.[n].name:jpg,jpeg,png,gif,pdf,doc,docx,txt,zip - your preferred allowed extensions
      Example: Submission.[n].photo:jpg,jpeg,png
    3) Add data in "File name provider" or leave blank;
      Example: {date:YHis}_{data:fieldname}_{var:upload9.file.name}.{var:upload9.file.extension}
    4) Alter Upload directory path or leave unchanged;
      Examples:
        {path:root}/uploads/
        {path:root}/uploads/{date:Y} - saves file in the folder of current year;
 
IV = To save uploaded files in separate rows in DB:

  1. Add action "Loop event";

  2. Set up action "Loop event"
    1) Data provider: {data:Model} Example: {data:Submission};
    2) Keys provider: {var:area_repeater#.key}
    3) Switch on toggle "Return the result as var?";

  3. Add action "Save Data";

  4. Set up Action "Save Data":
    1) Switch off toggles
      "Auto manage the data table"
      "Auto save fields"
    2) Choose the Database table;
    3) Add data provider: {var:loop_event#.row}

  5. Add necessary fields in "Data overrides" tables:
      1) table field name:value where value will be as follows: {var:loop_event#.row.uploadfilefieldname}
        Example: photo:{var:loop_event7.row.photo} 
 

You may also like:

Comments:

You need to login to be able to post a comment.