Skip to content
GitLab
Projects Groups Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in / Register
  • B bootstrap
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 263
    • Issues 263
    • List
    • Boards
    • Service Desk
    • Milestones
  • Merge requests 114
    • Merge requests 114
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Packages and registries
    • Packages and registries
    • Package Registry
    • Infrastructure Registry
  • Monitor
    • Monitor
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • Bootstrap
  • bootstrap
  • Issues
  • #5973
Closed
Open
Issue created Nov 21, 2012 by Administrator@rootContributor

Collapse: Using preventDefault() in show/hide events breaks collapse

Created by: RoToRa

By looking at the source code evidently the Collapse JavaScript component ist supposed to support canceling the functionality by calling preventDefault() in an show or hide event handler (if (startEvent.isDefaultPrevented()) return, line 105).

However doing this only cancels the collapse/expand partially, namely the action inside the transition method. The actual collapsing/expanding happens after calling the transition method (line 70, line 79) and thus is uneffected by the isDefaultPrevented() check.

This leads to an undefined state of the collapse element with the in class set but height: 0, or the in not set and ´height: auto`, where it should be vice-versa. This again in turn causes the collapsing/expanding not to work anymore.

For a reproduction example see http://jsfiddle.net/qQv5S/ . Here a show and hide event handler ist applied to two collapse elements using jQuery's .one() method. The handler only contains an alert (in oder to show when its being executed) and a preventDefault(). Dispite the preventDefault() the first click on the texts "Test 1" or "Test 2" still collapses/expands the elements. Furthermore any further clicks on the texts no longer expand/collapse the elements dispite the event handler no longer being executed anymore.

Assignee
Assign to
Time tracking