Modal autoresize causes bottom of the modal to disappear

Created on 11 February 2021, almost 4 years ago
Updated 5 September 2024, 2 months ago

Problem/Motivation

Similar to https://www.drupal.org/project/entity_reference_tree/issues/3068466 β†’

When the modal opens and there are only a few main nodes that are closed, the modal gets the correct height, and is centered. When the nodes are opened, the modal resizes, but is not recentered.
This results in the bottom of the modal disappearing at the bottom of the screen.

When the modal opens and there are enough main nodes, so that the modal goes to the maximum height, there is no problem.

Steps to reproduce

- Taxonomy tree with small number of nodes on level 1
- Open taxonomy tree with no items selected and nodes collapsed
- Click to open nodes

Possible resolution

The modal can be resized when opening/closing a node by triggering resize.dialogResize. This updates the top of the dialog, but this results in the modal jumping up and down, which is not very nice.

Maybe the modal can be opened at full screen height straight away, regardless of the content.

πŸ› Bug report
Status

Needs work

Version

2.0

Component

User interface

Created by

πŸ‡§πŸ‡ͺBelgium ducktape

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • πŸ‡ΈπŸ‡°Slovakia coaston

    I am changing priotity as this is critical issue. This module is not usable when using more taxonomy terms. Experiencing the same issue.
    Please provide patch.

  • Status changed to Needs review about 1 year ago
  • πŸ‡ΈπŸ‡°Slovakia coaston

    I found out that auto still not working right, however direct value looks good.
    Replace in js/entity_reference_tree.js

    - $("#entity-reference-tree-modal").dialog( "option", { height: 'auto' } );
    + $("#entity-reference-tree-modal").dialog( "option", { height:'650' } );
    

    Does work.

  • First commit to issue fork.
  • Merge request !12Addressed size of modal issues. β†’ (Open) created by billdaff
  • Pipeline finished with Failed
    4 months ago
    Total: 145s
    #227078
  • πŸ‡ΊπŸ‡ΈUnited States billdaff

    Opened up an MR to help with this. I am not sure if it achieves all that you want, I incorporated some of the changes above. I left height as auto, but set max-height to 450px. Not sure if this is exactly the course you were looking to go, but it resolved for me.

  • πŸ‡¦πŸ‡ΊAustralia mingsong πŸ‡¦πŸ‡Ί

    There is an error with the automated PHPUnit test.

    1) Drupal\Tests\entity_reference_tree\FunctionalJavascript\BasicJavascriptTest::testEntityReferenceTreeJavascript
    Behat\Mink\Exception\ResponseTextException: The text "Selected (3 of unlimited): Node 1 (1), Node 2 (2), Node 3 (3)" was not found anywhere in the text of the current page.

    https://git.drupalcode.org/issue/entity_reference_tree-3197987/-/jobs/26...

    Is there anyone know why? We can merge a MR that is failed from test.

  • Status changed to Needs work 2 months ago
  • πŸ‡¦πŸ‡ΊAustralia mingsong πŸ‡¦πŸ‡Ί
  • πŸ‡¦πŸ‡ΊAustralia mingsong πŸ‡¦πŸ‡Ί

    Ok, first the selected nodes tip is required by others, we can't remove this feature. And second, I don't think hard-code the hight would fit all size of screen.

Production build 0.71.5 2024