enable/disable f7Tab

[kmezhoud]

Hi,

I'm looking for the class of the f7tab to enable/disable toggle tab-links.
Thanks

library(shinyMobile)
library(shinyjs)
library(shiny)

shiny::shinyApp(
  ui = f7Page(
    title = "Tab Layout",
    options = list(theme= "auto", dark= FALSE, filled=FALSE),
    f7TabLayout(
      navbar = f7Navbar(title = 'Navbar' ,shadow = TRUE),
      f7Tabs(
        id = "tabs_id",
        swipeable = FALSE,
        animated = FALSE,
        
        f7Tab(
          tabName = "TAB1",
            active = TRUE,
          
          f7Text(
            inputId = "username_id",
            label = h5("Username:"),
            value = "Foo",#NULL,
            placeholder = "Username"
          ),
          #textInput("userName_db", "User Name:", "root"),
          f7Password(
            inputId = "passwd_id",
            label = h3("Password:"),
            placeholder = "Password"
          ),
          f7Button(inputId = "btn_Login" ,label = "Login" )
        ),
        f7Tab(tabName = "TAB2", "tab 2 text"),
        f7Tab(tabName = "TAB3", "tab 3 text")
      )
    )
  ),
  server = function(input, output) {

   ## disable TAB2 and wait for login 
    shinyjs::disable(selector = "TAB2")

    shinyjs::disable(selector = '.nav-link a[data-value="TAB2"')
    shinyjs::disable(selector = '.nav-tabs a[tabName="TAB2"')
    shinyjs::disable(selector = '.f7-tabbar-link a[tabName="TAB2"')
    shinyjs::disable(selector = '.button tab-link a[tabName="TAB2"')
    shinyjs::disable(selector = '.tablinks a[tabName="TAB2"')
    shinyjs::disable(selector = '.tablinks a[data-value="TAB2"')
    
    observeEvent(input$btn_Login,{
      if(isolate(input$username_id) == isolate(input$passwd_id)){
        print('OK')
        shinyjs::enable(selector = "TAB2")
      }else{
        print("KO")
      }
    })
  
  }
)