Trix: link_url validation prevents submission of form when using parsley.js

Created on 13 Jun 2016  路  1Comment  路  Source: basecamp/trix

When validating forms with Parsley.js, trix's link url validation is triggered and the form does not submit.

Steps to Reproduce
  1. Use parsley.js to validate a form that contains a trix editor field.
  2. Submit valid values for all validation-enabled fields.
  3. Form does not submit.
    Details
  • Trix version: 0.9.7
  • Browser name and version: Chrome 51.0.2704.84 + Firefox 46.0.1 (Safari 9.1.1 submitted okay)
  • Operating system: os x 10.10.5
  • I haven't had a chance to test this with other validation libraries, but any library that binds inputs based on the html5 validation attribute may also conflict. If not, then this can be closed and I'll work around the situation.

Most helpful comment

It seems that Parsley differs from the HTML5 constraints spec in regard to disabled inputs, which are normally excluded from validation.

screen shot 2016-06-16 at 8 36 12 am
(true means valid)

Parsley's documentation highlights excluding disabled inputs using a data-parsley-excluded attribute: http://parsleyjs.org/doc/index.html#psly-usage-form

I've confirmed this works and prevents validating Trix's URL input:

<form data-parsley-validate data-parsley-excluded="[disabled]">
  <trix-editor></trix-editor>
  <input type="submit">
</form>

>All comments

It seems that Parsley differs from the HTML5 constraints spec in regard to disabled inputs, which are normally excluded from validation.

screen shot 2016-06-16 at 8 36 12 am
(true means valid)

Parsley's documentation highlights excluding disabled inputs using a data-parsley-excluded attribute: http://parsleyjs.org/doc/index.html#psly-usage-form

I've confirmed this works and prevents validating Trix's URL input:

<form data-parsley-validate data-parsley-excluded="[disabled]">
  <trix-editor></trix-editor>
  <input type="submit">
</form>
Was this page helpful?
0 / 5 - 0 ratings

Related issues

lanzhiheng picture lanzhiheng  路  4Comments

andreimoment picture andreimoment  路  3Comments

adueck picture adueck  路  3Comments

atuttle picture atuttle  路  4Comments

radcliff picture radcliff  路  5Comments