Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use validationException with ajax forms #56

Open
PubliAlex opened this issue Feb 14, 2021 · 0 comments
Open

Use validationException with ajax forms #56

PubliAlex opened this issue Feb 14, 2021 · 0 comments

Comments

@PubliAlex
Copy link

PubliAlex commented Feb 14, 2021

Hello,

When I'm working with octoberCMS, I used to use inline field validation with ajax forms triggered with data-attribute API.

I'm discovering buddies, and the whole shopaholic ecosystem, I can't figure out how to make it works. Here is the code of my page.

title = "Inscription"
url = "/inscription"
layout = "default"
is_hidden = 0

[Registration]
mode = "ajax"
flash_on = 1
redirect_on = 1
redirect_page = "compte/connexion"
activation = "activation_on"
force_login = 1
==
{% set arError = Registration.getErrorMessage %}
{% set arForm = Registration.getOldFormData %}

<section id="inscription" class="pb-3 pt-3">
    <div class="container">
        <form data-request="Registration::onAjax" data-request-validate>
            
            <div class="form-floating mb-3">
                <input class="form-control" type="text" id="field-email" name="email" placeholder="&nbsp;" value="{{ arForm.email }}" />
                <label class="form-label" for="field-email">{{ 'Email'|_ }}</label>
                <div class="invalid-feedback" data-validate-for="email"></div>
            </div>
            
            <div class="form-floating mb-3">
                <input class="form-control" type="password" id="field-password" name="password" placeholder="&nbsp;" />
                <label class="form-label" for="field-password">{{ 'Mot de passe'|_ }}</label>
                <div class="invalid-feedback" data-validate-for="password"></div>
            </div>
            
            <div class="form-floating mb-3">
                <input class="form-control" type="password" id="field-password-confirmation" name="password_confirmation" placeholder="&nbsp;" />
                <label class="form-label" for="field-password-confirmation">{{ 'Confirmez le mot de passe'|_ }}</label>
                <div class="invalid-feedback" data-validate-for="password_confirmation"></div>
            </div>

            <button class="btn btn-primary" type="submit">{{ 'Créer un compte'|_ }}</button>
        </form>
    </div>
</section>

I created that issue on Buddies plugin cause I'm testing with registration page first, but I believe it's a more global request as, for what I understood, it rely on Toolbox classes to handle form submission.

So maybe it's a toolbox request, but I think we should be able to use the octobercms way to handle fields error, using data-request-validate on form, and data-validate-for on elements.

Thank you

@PubliAlex PubliAlex changed the title Simple ajax subscribe form Use validationException with ajax forms Feb 14, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant