R Shiny:将 navbarPage 与 shinyBS 的 bsModal 一起使用
R Shiny: Use navbarPage with bsModal by shinyBS
我正在尝试在 navbarPage 中添加一个 tabPanel,以便在您单击它时打开模式 window 而不是新选项卡。下面的代码片段无效,因为 tabPanel 没有 id 参数。
library(shiny)
library(shinyBS)
shinyUI(fluidPage(
navbarPage("Sample App", id = "main_menu",
tabPanel("Open Modal", id = "moda")),
bsModal("modal1", "Example", "moda", p("This is a modal"))
)
如果我从浏览器编辑生成的 HTML 代码,我可以通过更改行
来实现这一点
<a href="#tab-9741-5" data-toggle="tab" data-value="Open Modal">Open Modal</a>
和
<a href="#" data-toggle="modal" data-target="#modal1">Open Modal</a>
在 <li>
元素上。
知道如何做到这一点,或者至少我怎样才能从 shiny 覆盖生成的 html?
一种解决方案是使用Javascript 重写选项卡标题的属性。下面的 JS 代码找到选项卡标题 link,并重写其属性。
library(shiny)
jsStr <- '$(document).ready(function(){
$("a[data-value=\'OpenModal\']").attr({
"href":"#",
"data-toggle":"modal",
"data-target":"#modal1"
});
})
'
ui <- shinyUI(fluidPage(
tags$head(tags$script(HTML(jsStr))),
navbarPage("title",
tabPanel("OpenModal")
),
bsModal("modal1", "Example", "moda", p("This is a modal"))
))
我正在尝试在 navbarPage 中添加一个 tabPanel,以便在您单击它时打开模式 window 而不是新选项卡。下面的代码片段无效,因为 tabPanel 没有 id 参数。
library(shiny)
library(shinyBS)
shinyUI(fluidPage(
navbarPage("Sample App", id = "main_menu",
tabPanel("Open Modal", id = "moda")),
bsModal("modal1", "Example", "moda", p("This is a modal"))
)
如果我从浏览器编辑生成的 HTML 代码,我可以通过更改行
来实现这一点<a href="#tab-9741-5" data-toggle="tab" data-value="Open Modal">Open Modal</a>
和
<a href="#" data-toggle="modal" data-target="#modal1">Open Modal</a>
在 <li>
元素上。
知道如何做到这一点,或者至少我怎样才能从 shiny 覆盖生成的 html?
一种解决方案是使用Javascript 重写选项卡标题的属性。下面的 JS 代码找到选项卡标题 link,并重写其属性。
library(shiny)
jsStr <- '$(document).ready(function(){
$("a[data-value=\'OpenModal\']").attr({
"href":"#",
"data-toggle":"modal",
"data-target":"#modal1"
});
})
'
ui <- shinyUI(fluidPage(
tags$head(tags$script(HTML(jsStr))),
navbarPage("title",
tabPanel("OpenModal")
),
bsModal("modal1", "Example", "moda", p("This is a modal"))
))