Uploaded image for project: 'Blesta Core'
  1. Blesta Core
  2. CORE-2546

Add ability to disable submit buttons on submit

    Details

    • Type: Story
    • Status: Closed
    • Priority: Major
    • Resolution: Fixed
    • Affects Version/s: None
    • Fix Version/s: 4.3.0-b1
    • Component/s: None
    • Labels:
      None

      Description

      We need the ability, via JavaScript, to disable form submission buttons on submit. It's possible to click a submit button multiple times very quickly to submit the same form more than once. This behavior is generally undesirable, so there should exist a method of disabling that for forms.

      1. Update the core JavaScript in the admin and client interfaces to support identical functionality of disabling form submission buttons. This can be done by specifying a class on the FORM tag, e.g. "disable-on-submit". By default, all form buttons of type "submit" will be disabled on submit. However, the FORM tag can specify a data attribute, e.g., "data-disable-on-submit" that contains a class referencing the specific elements to disable. (see CORE-2704)
        • <form class="disable-on-submit">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" />
          </form>
          
        • The above example, when submitted, will then add a new attribute "disabled='disabled'":
          <form class="disable-on-submit">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" disabled="disabled" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" disabled="disabled" />
          </form>
          
      2. Form submissions that are submitted via AJAX should re-enabled once the AJAX response has been received. Similar to the above, functionality should exist to re-enable disabled submit buttons on a form. NOTE: It may be best for the form to be left alone and have the template itself determine whether to re-enable the button. We might be able to include a function by which to re-enable them, but it would likely need to be called by the template.
      3. Add additional subtasks here for each plugin that should also be updated.

        Issue Links

          Activity

          tyson Tyson Phillips (Inactive) created issue -
          tyson Tyson Phillips (Inactive) made changes -
          Field Original Value New Value
          Rank Ranked higher
          tyson Tyson Phillips (Inactive) made changes -
          Story Points 8
          tyson Tyson Phillips (Inactive) made changes -
          Description We need the ability, via JavaScript, to disable form submission buttons on submit. It's possible to click a submit button multiple times very quickly to submit the same form more than once. This behavior is generally undesirable, so there should exist a method of disabling that for forms.

          # Update the core JavaScript in the admin and client interfaces to support identical functionality of disabling form submission buttons. This can be done by specifying a class on the FORM tag, e.g. "disable-on-submit". By default, all form buttons of type "submit" will be disabled on submit. However, the FORM tag can specify a data attribute, e.g., "data-disable-on-submit" that contains a class referencing the specific elements to disable.
          #* {code:html}
          <form class="disable-on-submit" data-disable-on-submit="button,process">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" />
          </form>
          {code}
          #* The above example, when submitted, will then add a new attribute "disabled='disabled'":
          {code:html}
          <form class="disable-on-submit" data-disable-on-submit="disable_me">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" disabled="disabled" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" disabled="disabled" />
          </form>
          {code}
          # Form submissions that are submitted via AJAX should re-enabled once the AJAX response has been received. Similar to the above, functionality should exist to re-enable disabled submit buttons on a form.
          We need the ability, via JavaScript, to disable form submission buttons on submit. It's possible to click a submit button multiple times very quickly to submit the same form more than once. This behavior is generally undesirable, so there should exist a method of disabling that for forms.

          # Update the core JavaScript in the admin and client interfaces to support identical functionality of disabling form submission buttons. This can be done by specifying a class on the FORM tag, e.g. "disable-on-submit". By default, all form buttons of type "submit" will be disabled on submit. However, the FORM tag can specify a data attribute, e.g., "data-disable-on-submit" that contains a class referencing the specific elements to disable.
          #* {code:html}
          <form class="disable-on-submit" data-disable-on-submit="button,process">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" />
          </form>
          {code}
          #* The above example, when submitted, will then add a new attribute "disabled='disabled'":
          {code:html}
          <form class="disable-on-submit" data-disable-on-submit="disable_me">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" disabled="disabled" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" disabled="disabled" />
          </form>
          {code}
          # Form submissions that are submitted via AJAX should re-enabled once the AJAX response has been received. Similar to the above, functionality should exist to re-enable disabled submit buttons on a form. NOTE: It may be best for the form to be left alone and have the template itself determine whether to re-enable the button. We might be able to include a function by which to re-enable them, but it would likely need to be called by the template.
          tyson Tyson Phillips (Inactive) made changes -
          Description We need the ability, via JavaScript, to disable form submission buttons on submit. It's possible to click a submit button multiple times very quickly to submit the same form more than once. This behavior is generally undesirable, so there should exist a method of disabling that for forms.

          # Update the core JavaScript in the admin and client interfaces to support identical functionality of disabling form submission buttons. This can be done by specifying a class on the FORM tag, e.g. "disable-on-submit". By default, all form buttons of type "submit" will be disabled on submit. However, the FORM tag can specify a data attribute, e.g., "data-disable-on-submit" that contains a class referencing the specific elements to disable.
          #* {code:html}
          <form class="disable-on-submit" data-disable-on-submit="button,process">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" />
          </form>
          {code}
          #* The above example, when submitted, will then add a new attribute "disabled='disabled'":
          {code:html}
          <form class="disable-on-submit" data-disable-on-submit="disable_me">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" disabled="disabled" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" disabled="disabled" />
          </form>
          {code}
          # Form submissions that are submitted via AJAX should re-enabled once the AJAX response has been received. Similar to the above, functionality should exist to re-enable disabled submit buttons on a form. NOTE: It may be best for the form to be left alone and have the template itself determine whether to re-enable the button. We might be able to include a function by which to re-enable them, but it would likely need to be called by the template.
          We need the ability, via JavaScript, to disable form submission buttons on submit. It's possible to click a submit button multiple times very quickly to submit the same form more than once. This behavior is generally undesirable, so there should exist a method of disabling that for forms.

          # Update the core JavaScript in the admin and client interfaces to support identical functionality of disabling form submission buttons. This can be done by specifying a class on the FORM tag, e.g. "disable-on-submit". By default, all form buttons of type "submit" will be disabled on submit. However, the FORM tag can specify a data attribute, e.g., "data-disable-on-submit" that contains a class referencing the specific elements to disable.
          #* {code:html}
          <form class="disable-on-submit" data-disable-on-submit="button,process">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" />
          </form>
          {code}
          #* The above example, when submitted, will then add a new attribute "disabled='disabled'":
          {code:html}
          <form class="disable-on-submit" data-disable-on-submit="disable_me">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" disabled="disabled" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" disabled="disabled" />
          </form>
          {code}
          # Form submissions that are submitted via AJAX should re-enabled once the AJAX response has been received. Similar to the above, functionality should exist to re-enable disabled submit buttons on a form. NOTE: It may be best for the form to be left alone and have the template itself determine whether to re-enable the button. We might be able to include a function by which to re-enable them, but it would likely need to be called by the template.
          # Add additional subtasks here for each plugin that should also be updated.
          tyson Tyson Phillips (Inactive) made changes -
          Sprint 4.3.0 Sprint 1 [ 49 ]
          tyson Tyson Phillips (Inactive) made changes -
          Rank Ranked higher
          tyson Tyson Phillips (Inactive) made changes -
          Assignee Tyson Phillips [ tyson ] Jonathan Reissmueller [ jonathan ]
          tyson Tyson Phillips (Inactive) made changes -
          Fix Version/s 4.3.0-b1 [ 11019 ]
          tyson Tyson Phillips (Inactive) made changes -
          Sprint 4.3.0 Sprint 1 [ 49 ] 4.3.0 Sprint 2 [ 52 ]
          tyson Tyson Phillips (Inactive) made changes -
          Rank Ranked lower
          tyson Tyson Phillips (Inactive) made changes -
          Sprint 4.3.0 Sprint 2 [ 52 ] 4.3.0 Sprint 2, 4.3.0 Sprint 3 [ 52, 53 ]
          tyson Tyson Phillips (Inactive) made changes -
          Rank Ranked higher
          Automated transition triggered when Jonathan Reissmueller created a branch in Stash -
          Status Open [ 1 ] In Progress [ 3 ]
          tyson Tyson Phillips (Inactive) made changes -
          Sprint 4.3.0 Sprint 2, 4.3.0 Sprint 3 [ 52, 53 ] 4.3.0 Sprint 2, 4.3.0 Sprint 3, 4.3.0 Sprint 4 [ 52, 53, 54 ]
          tyson Tyson Phillips (Inactive) made changes -
          Description We need the ability, via JavaScript, to disable form submission buttons on submit. It's possible to click a submit button multiple times very quickly to submit the same form more than once. This behavior is generally undesirable, so there should exist a method of disabling that for forms.

          # Update the core JavaScript in the admin and client interfaces to support identical functionality of disabling form submission buttons. This can be done by specifying a class on the FORM tag, e.g. "disable-on-submit". By default, all form buttons of type "submit" will be disabled on submit. However, the FORM tag can specify a data attribute, e.g., "data-disable-on-submit" that contains a class referencing the specific elements to disable.
          #* {code:html}
          <form class="disable-on-submit" data-disable-on-submit="button,process">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" />
          </form>
          {code}
          #* The above example, when submitted, will then add a new attribute "disabled='disabled'":
          {code:html}
          <form class="disable-on-submit" data-disable-on-submit="disable_me">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" disabled="disabled" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" disabled="disabled" />
          </form>
          {code}
          # Form submissions that are submitted via AJAX should re-enabled once the AJAX response has been received. Similar to the above, functionality should exist to re-enable disabled submit buttons on a form. NOTE: It may be best for the form to be left alone and have the template itself determine whether to re-enable the button. We might be able to include a function by which to re-enable them, but it would likely need to be called by the template.
          # Add additional subtasks here for each plugin that should also be updated.
          We need the ability, via JavaScript, to disable form submission buttons on submit. It's possible to click a submit button multiple times very quickly to submit the same form more than once. This behavior is generally undesirable, so there should exist a method of disabling that for forms.

          # Update the core JavaScript in the admin and client interfaces to support identical functionality of disabling form submission buttons. This can be done by specifying a class on the FORM tag, e.g. "disable-on-submit". By default, all form buttons of type "submit" will be disabled on submit. However, the FORM tag can specify a data attribute, e.g., "data-disable-on-submit" that contains a class referencing the specific elements to disable.
          #* {code:html}
          <form class="disable-on-submit" data-disable-on-submit="disable_me">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" />
          </form>
          {code}
          #* The above example, when submitted, will then add a new attribute "disabled='disabled'":
          {code:html}
          <form class="disable-on-submit" data-disable-on-submit="disable_me">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" disabled="disabled" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" disabled="disabled" />
          </form>
          {code}
          # Form submissions that are submitted via AJAX should re-enabled once the AJAX response has been received. Similar to the above, functionality should exist to re-enable disabled submit buttons on a form. NOTE: It may be best for the form to be left alone and have the template itself determine whether to re-enable the button. We might be able to include a function by which to re-enable them, but it would likely need to be called by the template.
          # Add additional subtasks here for each plugin that should also be updated.
          tyson Tyson Phillips (Inactive) made changes -
          Sprint 4.3.0 Sprint 2, 4.3.0 Sprint 3, 4.3.0 Sprint 4 [ 52, 53, 54 ] 4.3.0 Sprint 2, 4.3.0 Sprint 3, 4.3.0 Sprint 4, 4.3.0 Sprint 5 [ 52, 53, 54, 55 ]
          tyson Tyson Phillips (Inactive) made changes -
          Rank Ranked higher
          tyson Tyson Phillips (Inactive) made changes -
          Sprint 4.3.0 Sprint 2, 4.3.0 Sprint 3, 4.3.0 Sprint 4, 4.3.0 Sprint 5 [ 52, 53, 54, 55 ] 4.3.0 Sprint 2, 4.3.0 Sprint 3, 4.3.0 Sprint 4, 4.3.0 Sprint 5, 4.3.0 Sprint 6 [ 52, 53, 54, 55, 56 ]
          tyson Tyson Phillips (Inactive) made changes -
          Sprint 4.3.0 Sprint 2, 4.3.0 Sprint 3, 4.3.0 Sprint 4, 4.3.0 Sprint 5, 4.3.0 Sprint 6 [ 52, 53, 54, 55, 56 ] 4.3.0 Sprint 2, 4.3.0 Sprint 3, 4.3.0 Sprint 4, 4.3.0 Sprint 5, 4.3.0 Sprint 8 [ 52, 53, 54, 55, 58 ]
          tyson Tyson Phillips (Inactive) made changes -
          Rank Ranked higher
          tyson Tyson Phillips (Inactive) made changes -
          Sprint 4.3.0 Sprint 2, 4.3.0 Sprint 3, 4.3.0 Sprint 4, 4.3.0 Sprint 5, 4.3.0 Sprint 8 [ 52, 53, 54, 55, 58 ] 4.3.0 Sprint 2, 4.3.0 Sprint 3, 4.3.0 Sprint 4, 4.3.0 Sprint 5, 4.3.0 Sprint 8, 4.3.0 Sprint 9 [ 52, 53, 54, 55, 58, 60 ]
          tyson Tyson Phillips (Inactive) made changes -
          Rank Ranked higher
          tyson Tyson Phillips (Inactive) made changes -
          Link This issue relates to CORE-2704 [ CORE-2704 ]
          tyson Tyson Phillips (Inactive) made changes -
          Description We need the ability, via JavaScript, to disable form submission buttons on submit. It's possible to click a submit button multiple times very quickly to submit the same form more than once. This behavior is generally undesirable, so there should exist a method of disabling that for forms.

          # Update the core JavaScript in the admin and client interfaces to support identical functionality of disabling form submission buttons. This can be done by specifying a class on the FORM tag, e.g. "disable-on-submit". By default, all form buttons of type "submit" will be disabled on submit. However, the FORM tag can specify a data attribute, e.g., "data-disable-on-submit" that contains a class referencing the specific elements to disable.
          #* {code:html}
          <form class="disable-on-submit" data-disable-on-submit="disable_me">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" />
          </form>
          {code}
          #* The above example, when submitted, will then add a new attribute "disabled='disabled'":
          {code:html}
          <form class="disable-on-submit" data-disable-on-submit="disable_me">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" class="disable_me" disabled="disabled" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" class="disable_me" disabled="disabled" />
          </form>
          {code}
          # Form submissions that are submitted via AJAX should re-enabled once the AJAX response has been received. Similar to the above, functionality should exist to re-enable disabled submit buttons on a form. NOTE: It may be best for the form to be left alone and have the template itself determine whether to re-enable the button. We might be able to include a function by which to re-enable them, but it would likely need to be called by the template.
          # Add additional subtasks here for each plugin that should also be updated.
          We need the ability, via JavaScript, to disable form submission buttons on submit. It's possible to click a submit button multiple times very quickly to submit the same form more than once. This behavior is generally undesirable, so there should exist a method of disabling that for forms.

          # Update the core JavaScript in the admin and client interfaces to support identical functionality of disabling form submission buttons. This can be done by specifying a class on the FORM tag, e.g. "disable-on-submit". By default, all form buttons of type "submit" will be disabled on submit. -However, the FORM tag can specify a data attribute, e.g., "data-disable-on-submit" that contains a class referencing the specific elements to disable.- (see CORE-2704)
          #* {code:html}
          <form class="disable-on-submit">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" />
          </form>
          {code}
          #* The above example, when submitted, will then add a new attribute "disabled='disabled'":
          {code:html}
          <form class="disable-on-submit">
              <input type="text" name="test" value="Test" />
              <input type="button" name="button" value="Press Me" disabled="disabled" />
              <input type="submit" name="process" value="Process" />
              <button type="submit" name="submit" value="Submit" disabled="disabled" />
          </form>
          {code}
          # Form submissions that are submitted via AJAX should re-enabled once the AJAX response has been received. Similar to the above, functionality should exist to re-enable disabled submit buttons on a form. NOTE: It may be best for the form to be left alone and have the template itself determine whether to re-enable the button. We might be able to include a function by which to re-enable them, but it would likely need to be called by the template.
          # Add additional subtasks here for each plugin that should also be updated.
          Automated transition triggered when Tyson Phillips (Inactive) created pull request #446 in Stash -
          Status In Progress [ 3 ] In Review [ 5 ]
          Resolution Fixed [ 1 ]
          Automated transition triggered when Tyson Phillips (Inactive) merged pull request #446 in Stash -
          Status In Review [ 5 ] Closed [ 6 ]
          tyson Tyson Phillips (Inactive) made changes -
          Link This issue relates to CORE-3203 [ CORE-3203 ]

            People

            • Assignee:
              jonathan Jonathan Reissmueller
              Reporter:
              tyson Tyson Phillips (Inactive)
            • Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:
                Fix Release Date:
                15/Jun/18

                Time Tracking

                Estimated:
                Original Estimate - Not Specified
                Not Specified
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 2 days, 2 hours, 19 minutes
                2d 2h 19m

                  Agile