css - f7SmartSelect loses style if used with selectInput

Question

I am trying to use shiny selectInput into DT in shinyMobile app that uses by default f7SmartSelect whish has a different style adapted to mobile. But the issue comes when these two select inputs are used together, f7SmartSelect loses its style.

If you run the code, It is not possible to select from the second and the third f7SmartSelect ui. the variables of these two ui are not visible.

Thanks!

suppressMessages({
  library(shiny)
  library(shinyMobile)
})


ui <- f7Page(
  title = "",
  f7SingleLayout(
    navbar = f7Navbar(
      title = "",
      #hairline = TRUE,
      shadow = TRUE
    ),
    

    uiOutput("ui_f7SmartSelect1"),
    uiOutput("ui_f7SmartSelect2"),
    uiOutput("ui_f7SmartSelect3"),
    uiOutput("ui_SelectInput")

    
  )
)


server <- function(input, output, session) {
  

  output$ui_f7SmartSelect1 <- renderUI({
    
    f7SmartSelect(
      inputId = "smartSelect1_id",
      label = "SmartSelect 1:",
      selected = NULL,
      choices =  c("A", "B", "C"),
      openIn = "popup",  
      searchbar = TRUE,
      multiple = TRUE
    )
    
    
  })
  
  output$ui_f7SmartSelect2 <- renderUI({
    
    req(input$smartSelect1_id)
    f7SmartSelect(
      inputId = "smartSelect2_id",
      label =  "SmartSelect 2:",
      selected = NULL,
      choices = list("1", "2", "3"),
      openIn = "popup",  
      searchbar = TRUE,
      multiple = TRUE)

  })
  
  output$ui_f7SmartSelect3 <- renderUI({
    
    req(input$smartSelect2_id)
    f7SmartSelect("smartSelect3_id", label = "SmartSelect 3",
                  choices =  c("E", "F", "G"),
                  selected = NULL,
                  multiple = TRUE,
                  openIn = "popup" 
    )
  
  })
    

  output$ui_SelectInput <- renderUI({
    selectInput(inputId = "select_id", label = "selectize Input",
                   choices = c("X", "Y", "Z"))
  })
  
}

shinyApp(ui = ui, server = server)

question from:https://stackoverflow.com/questions/65920889/f7smartselect-loses-style-if-used-with-selectinput

Answer 1

Waitting for answers