Magic Forms Upload AJAX Form

You can use Upload AJAX Form component from the Magic Forms plugin to add Form which can upload files to server using ajax.

You can customise upload settings from component's Uploader settings group. You need to Allow uploads from the settings.

As other forms you can override component HTML markup with your form by adding partial in to theme.

Note: replace uploadForm with your component alias name.

Example Upload Ajax Form Markup:

{{ form_ajax(__SELF__ ~ '::onFormSubmit') }}
    <div id="{{ __SELF__ }}_forms_flash"></div>

    <!-- OTHER FORM FIELDS -->

    {% partial '@file-upload' %}
    {{ form_submit() }}
{{ form_close() }}

Once user uploads the file you can check it from the backend section of OctoberCMS.

You need to navigate to Magic Forms > Records menu to check submitted records. Once you click on them you can check all the field inforamtion as well file attachement.

magic-forms-backend-records

You can also check other types of Magic Forms such as generic ajax form and empty ajax form.

js interview questions