New to the community? Start here

[Forminator Pro] Adding "readonly" (or "disabled") to an input

Hello! I’m looking for a way to add “readonly” to an input (text) field that is not a calculation. It’d be badass if “readonly” was just an option added to any form field (#FeatureRequest).
Can you tell me if you already have an easy-ish filter I can hook into to add the disabled flag to my inputs? Or maybe to add my own readonly checkbox on the existing form field options, which then adds the disabled or readonly attribute to the field?

Tue, 9 Feb 2021 20:55:41
More Forminator Pro discussions
Forminator Pro
  • Nebu John
    • FLS

    Hi Sam ,

    Trust you are doing good and thank you for reaching out to us.

    Thanks for your suggestion, I have brought this to the notice of the Forminator team for further discussion.

    Meanwhile we consider this as a feature, please add the following CSS at WP Dashboard >> Apperance >> Customizer >> Additional CSS:

    .formi-disabled-input {
     pointer-events: none;
}

    And add the class name, formi-disabled-input, as an additional class for the input fields that are needed to be disabled.

    [attachments are only viewable by logged-in members]

    I hope that helps.

    Kind Regards,
    Nebu John

  • Samantha
    • Flash Drive

    Thanks for the idea. I appreciate the thought, but I’d prefer not to do it like this because: the css property pointer-events only prevents interactions with a pointer (mouse, touch, stylus). This means the input is still focusable/actionable for keyboard users. If you wanted to completely neutralize the input, even for keyboard users, you could probably add an attribute tabindex=”-1″. That would prevent it from receiving keyboard focus, but you’d also want to add aria-disabled=”true” for assistive technologies…Even then, you might find yourself needing to use JavaScript to completely prevent it from being actionable. And…if we’re adding attributes to the form field, I’d just as soon use the HTML attr disabled.

    For anyone else who might come up against this, here’s what I’m doing instead: I’m using css (.d-none, if you’re using bootstrap) to hide the field I’d like to disable. I’m using that field in a calculation, which I’ve marked “hidden”. I am then using an HTML block to echo both the field I wanted to disable and the calculated field; I’m also using the value of the calculated field for my paypal button. (And since this is kind of a specific-case explanation, if anyone wants more detail, please feel free to hmu)

    Again, I super appreciate the idea – and I must mention that the rapid-response support I always get from you all is the bombdotcom.

    I’m going to mark this as resolved for now, but I do hope the forminator team will strongly consider adding the option for disabling a form field in the near future.