sammerk
sammerk

Reputation: 1173

radioButton() choices with HTML and shinyjs::reset()

I aim to get an radioButton() input with HTML in its labels and a reset functionality.

I started with the following, as radioButtons() does not allow HTML for the labels.

 library(shiny)
 library(shinyjs)

 ui <- shinyUI(bootstrapPage(

   useShinyjs(),
   tags$div(id = "form",
   tags$div(HTML('
                 <div id="rating" class="form-group shiny-input-radiogroup shiny-input-container">
                 <label class="control-label" for="rating">Your Rating:</label>
                 <div class="shiny-options-group">
                 <div class="radio">
                 <label>
                 <input type="radio" name="one" value="1"/>
                 <span><i class="fa fa-star" aria-hidden="true"></i></span>
                 </label>
                 </div>
                 <div class="radio">
                 <label>
                 <input type="radio" name="two" value="2"/>
                 <span><i class="fa fa-star" aria-hidden="true"></i><i class="fa fa-star" aria-hidden="true"></i></span>
                 </label>
                 </div>
                 </div>
                 </div>'))),

   actionButton("feedback_btn", "send feedback", icon = icon("send", lib = "font-awesome")),
   htmlOutput("Ratingout")
 ))

   server <- shinyServer(function(input, output, session) {
     output$Ratingout <- renderText({
       paste("The Rating was ", input$rating)
     })

     observeEvent(input$feedback_btn, {
       reset("rating")

     })
   })

   shinyApp(ui, server)

but I ran into two Problems:

Upvotes: 1

Views: 674

Answers (1)

Batanichek
Batanichek

Reputation: 7871

You need to bind inputs to shiny to use it on server side.

On my mind easily to overwrite shiny radioButtons

But in help you can see :

If you need to represent a "None selected" state, it's possible to default the radio buttons to have no options selected by using selected = character(0). However, this is not recommended, as it gives the user no way to return to that state once they've made a selection. Instead, consider having the first of your choices be c("None selected" = "").

So beter to use 0 as default value ( reset not work with character(0))

Example

library(shiny)
library(shinyjs)

edit_button=function(rb){

  for( i in 1:length(rb$children[[2]]$children[[1]])){
    value=as.numeric(rb$children[[2]]$children[[1]][[i]]$children[[1]]$children[[1]]$attribs$value)
    if(!is.na(value)&value>0){
    rb$children[[2]]$children[[1]][[i]]$children[[1]]$children[[2]]$children[[1]]=HTML(paste(rep('<i class="fa fa-star" aria-hidden="true"></i>',value),sep = "",collapse = ""))
    }
    }
  rb

}




ui <- shinyUI(bootstrapPage(
  edit_button( radioButtons("rate_","Rate",choices = list("None selected"=0,'one'=1,"two"=2))),
  useShinyjs(),
  actionButton("feedback_btn", "send feedback", icon = icon("send", lib = "font-awesome")),
  htmlOutput("Ratingout")
           ))

server <- shinyServer(function(input, output, session) {
  output$Ratingout <- renderText({
    paste("The Rating was ", input$rate_)
  })

  observeEvent(input$feedback_btn, {
    reset("rate_")
  })
})

shinyApp(ui, server)

Upvotes: 2

Related Questions