Skip to content

I can't close the box smoothly #393

@SerhEL

Description

@SerhEL

if the "collapsed" parameter is false, then when running js on the card-header, the box is abruptly closed. Code for playback:

library(shiny)
library(bs4Dash)

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody(
    tags$script(HTML("
$(document).ready(function() {
  // Убираем стандартное поведение
  $('.card-tools .btn-tool').removeAttr('data-card-widget'); 

  $('.card-header').click(function(event) {
    // Если кликнули на кнопку, игнорируем
    if ($(event.target).closest('.btn-tool').length) {
      return;
    }

    var card = $(this).closest('.card');
    var body = card.find('.card-body');
    var icon = card.find('.card-tools i');
    if (body.is(':visible')) {
      body.slideUp();
      card.addClass('collapsed-card');
      icon.removeClass('fa-minus').addClass('fa-plus');
    } else {
      body.slideDown();
      card.removeClass('collapsed-card');
      icon.removeClass('fa-plus').addClass('fa-minus');
    }
  });

  // Отдельно обрабатываем клик по кнопке, чтобы избежать двойного срабатывания
  $('.card-tools .btn-tool').click(function(event) {
    event.stopPropagation(); // Останавливаем всплытие события, чтобы оно не дошло до `.card-header`
    $(this).closest('.card-header').trigger('click'); // Вызываем обработчик вручную
  });
});
    ")),
    bs4Dash::box(
      title = 'collapsed true',
      icon = icon('nfc-directional'),
      width = 12,
      collapsed = TRUE,
      collapsible = TRUE, 
      ''
    ),
    bs4Dash::box(
      title = 'collapsed false',
      icon = icon('nfc-directional'),
      width = 12,
      collapsed = FALSE,
      collapsible = TRUE,
      ''
    )
  )
)
server <- function(input, output, session) {}
shinyApp(ui, server)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions