Как динамически добавлять текст строки в тело блестящего приложения?

Question

Я пытаюсь добавить реактивный текст (название цвета от selectInput) к телу блестящего приложения после tags$h3. Я думаю, что это больше проблема с jquery, но сейчас он продолжает добавлять выбранный цвет, а не отображать строку «реактивно».

Вместо этого я хочу, чтобы строка внутри h3.colorLabel была заменена.

ui.R

library(shiny) 
jsCode <- "shinyjs.pageCol = function(params){ 
$('body').css('background', params); 
/*$('.colorName').after('<h3></h3>').addClass('colorLabel'); 
$('h3.colorLabel').replaceWith('<h3>'+params+'</h3>').addClass('colorLabel'); 
*/ 
$('h3.colorName').after('<h3>'+params+'</h3>').addClass('colorLabel'); 
}; 
" 

shinyUI(fluidPage(
    useShinyjs(), 
    extendShinyjs(text = jsCode), 
    selectInput("col", "Colour:", 
       c("white", "yellow", "red", "blue", "purple")), 
    tags$h3('Just in case you are color-blind, the background color is:', class='colorName') 
)) 

server.R

library(shiny) 
library(shinyjs) 

shinyServer(


    function(input,output,session) { 

     observeEvent(input$col, { 
     js$pageCol(input$col) 
     }) 
     }) 

Answer 1

Я думаю, что это то, что вы хотите. Он редактирует внутренний элемент класса h3' element with the colorLabel`. Я также добавил соответствующий пустой инициализированный элемент в код ui, чтобы можно было что-то редактировать.

library(shiny) 
library(shinyjs) 

jsCode <- "shinyjs.pageCol = function(params){ 
$('body').css('background', params); 
$('h3.colorLabel').text(params); 
}; 
" 

u <- shinyUI(fluidPage(
    useShinyjs(), 
    extendShinyjs(text = jsCode), 
    selectInput("col","Colour:", 
       c("white","yellow","red","blue","purple")), 
    tags$h3('Just in case you are color-blind, the background color is:',class ='colorName'), 
    tags$h3('',class = 'colorLabel') 
)) 


s <- shinyServer(


    function(input,output,session) { 

    observeEvent(input$col, { 
     js$pageCol(input$col) 
    }) 
    }) 
shinyApp(ui = u,server = s) 

получают:

И это то, что редактируется внутренне: