Submit button keeps disabled with acceptance

  • emked

    (@emked)


    2 days, 16 hours ago

    When using Drag and Drop File Uploader together with the acceptance, the submit buttons keeps the disabled css class.

    When uploading a file the Drag and Drop File Uploader adds the attribute disabled and a css class disabled to the submit button. When accepting the acceptance checkbox, the disabled attribute will be removed, but the class disabled not. Because of this the vistor can’t submit the form.

    I now add a listeren on the checkbox to also remove the disabled css class to fix this. In my opinion the disabled css class is not needed. The disabled attribute should be enough.

    I don’t use the “acceptance_as_validation: on” option.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Glen Don Mongaya

    (@glenwpcoder)

    2 days, 16 hours ago

    Hello @emked ,

    Thanks for reaching out.
    Could you please paste your form code here so I can try and take a look?

    Also, can you go to “Contact -> Drag & Drop Upload” settings and make sure to uncheck “Enable jQuery”.

    Please let me know.

    Plugin Author Glen Don Mongaya

    (@glenwpcoder)

    2 days, 15 hours ago

    Also, the css .disabled class from the button is not preventing the form to submit maybe there’s css somewhere from the theme or something that changed the cursor pointer.

    I’ve added the class because I have something in the script to check or track if the button is currently disabled.

    Thread Starter emked

    (@emked)

    1 day, 18 hours ago

    Thanks for your reply. Here you have the form code:

    <div class="row">

    <div class="col-md-12">

    <div class="mb-3">

    <label for="name" class="form-label">Name</label>

    [text* name id:name class:form-control]

    </div>

    </div>

    </div>

    <div class="row">

    <div class="col-md-6">

    <div class="mb-3">

    <label for="emailaddress" class="form-label">Emailaddress</label>

    [email* emailaddress id:emailaddress class:form-control]

    </div>

    </div>

    <div class="col-md-6">

    <div class="mb-3 mb-md-0">

    <label for="phone" class="form-label">Phone</label>

    [text* phone id:phone class:form-control]

    </div>

    </div>

    </div>

    <div class="row">

    <div class="col-md-12">

    <label for="vraag" class="form-label">Motivation</label>

    [textarea motivation id:motivation x4 class:form-control class:h-100]

    </div>

    </div>

    <div class="row">

    <div class="col-md-12">

    [mfile upload-cv filetypes:pdf|txt|doc min-file:0 max-file:1]

    </div>

    </div>

    <div class="d-flex flex-column flex-md-row align-items-md-center justify-content-md-between">

    <div class="mb-3 mb-md-0 me-md-3">

    [acceptance terms class:terms] I agree with the privacy conditions [/acceptance]

    [turnstile]

    </div>

    [submit class:btn class:btn-primary "Contact me"]

    </div>

    I already had the option “Enable jQuery” unchecked because that gave a Javascript error.

    I use Bootstrap. This contains a .disabled class for buttons. Of coarse i could override this css and re-enable the button with the .disabled class, but it would be neater if the submit button doesn’t have a disabled class if it is not disabled.

Viewing 3 replies - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.