We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 36926
    • 701 Posts
    The way i've done this in the past is create a resource with no template assigned and a simple formIt call and the placeholder
    [[!+fi.success]]
    


    Then within my ajax call i'll send the data from my form to the resource containing the simple formIt call. If the page returns 1 I display a success message else there are issues and I display an error.
      • 3749
      • 24,544 Posts
      I usually use JavaScript to do the validation and inject the error messages before any form processing (with the processing aborted if there is an error).
        Did I help you? Buy me a beer
        Get my Book: MODX:The Official Guide
        MODX info for everyone: http://bobsguides.com/modx.html
        My MODX Extras
        Bob's Guides is now hosted at A2 MODX Hosting
        • 36926
        • 701 Posts
        Quote from: BobRay at Dec 01, 2016, 04:34 AM
        I usually use JavaScript to do the validation and inject the error messages before any form processing (with the processing aborted if there is an error).
        Yeah i'd do JS validation before submitting, but just incase the formIt call returns an error for whatever reason I want to let the user know it didn't send.
          • 3749
          • 24,544 Posts
          As long as you have the JS triggered by an onClick function on the Submit button, you should be able to have the form submit normally if there are no JS errors.
            Did I help you? Buy me a beer
            Get my Book: MODX:The Official Guide
            MODX info for everyone: http://bobsguides.com/modx.html
            My MODX Extras
            Bob's Guides is now hosted at A2 MODX Hosting
            • 51315
            • 67 Posts
            Hi all.
            It would be great to stick to the FormIt/AjaxForm integration as sponsored here: https://itchief.ru/lessons/modx-revo/modx-contact-form (it's in russian but a google translation is enough to get to the point).
            I have been following all the tutorial bits i found but i still can not make it work.

            Here is my snippet call:

            [[!AjaxForm?
                &snippet=`FormIt`
                &form=`tplAjaxForm`
                &hooks=`FormItSaveForm,email`
                &emailSubject=`New Contact`
                &emailFrom=`[[+email]]`
                &emailTo=`[email protected]`
                &emailTpl=`emailTpl`
                &validate=`name:required,email:email:required`
                &validationErrorMessage=`Please correct the following errors:[[+errors]]`
                &successMessage=`Cool, thanks`
            ]]


            And here is the form or tplAjaxForm chunk:

            <form id="contact-form" action="" method="post" class="ajax_form">
                <div class="form-group"><!-- Name -->
                    <label for="name" class="contact-label">
                        [[%af_label_name]] [[+fi.error.name]]
                    </label>
                    <input type="text" id="af_name" name="name" class="form-control" placeholder=""  value="[[+fi.name]]" />
                </div>
                <div class="form-group"><!-- Email -->
                    <label for="email" class="contact-label">
                        [[%af_label_email]] [[+fi.error.email]]
                    </label>
                    <input type="email" id="af_email" name="email" class="form-control" placeholder="" value="[[+fi.email]]" />
                </div>
                <div class="form-group">
                    <div class="form-group-margin">
                        <input type="submit" class="btn-submit" value="[[%af_submit]]" />
                    </div>
                </div>
                [[+fi.success:is=`1`:then=`
                <div class="alert alert-success">[[+fi.successMessage]]</div>
                `]]
                [[+fi.validation_error:is=`1`:then=`
                <div class="alert alert-danger">[[+fi.validation_error_message]]</div>
                `]]
            </form>


            According to the documentation it is supposed to work.
            But it doesn't.
            Does anyone has succeeded in sending emails using ONLY the FormIt/AjaxForm combination?
            It should be great to know. [ed. note: fredela last edited this post 7 years, 2 months ago.]