Fatima
Fatima

Reputation: 495

Result in a separate page in R shiny

I want when I click on the search button show the result on a separate page, not on the same page. I have tried two codes the first one:

UI:

ui = fluidPage(
  theme = shinytheme("cerulean"),
  mainPanel(

    div(align = "center", style="margin-left:500px",
        radioButtons("typeInput", "Extract tweets by: ",list("Hashtag" = "hashtag", "Twitter Username"= "username"),inline=T),
          textInput("hashtagInput", "Enter search string","", placeholder = "input search string"),
        conditionalPanel(
          condition = "input.typeInput == 'username'",
          textInput("usernameInput", "Username", placeholder = "input username")),
        sliderInput("numberInput", "Select number of tweets",min = 0, max = 3000, value = 100),
          br(),
        actionButton("goButton", "Search", icon("twitter"),
                     style="color: #fff; background-color: #337ab7"),
        uiOutput("pageStub")
    )))

server:

server = function(input, output){
  data = eventReactive(input$goButton, {

    if (input$typeInput == "hashtag") {
      tweetOutput = searchThis(search_string = input$hashtagInput,
                                      number.of.tweets = input$numberInput)} 
    else if (input$typeInput == "username") {
      tweetOutput = userTL(user.name = input$usernameInput,number.of.tweets = input$numberInput)}
    else {}
    library(twitteR)
    df.tweets = data.frame(tweetOutput)
    tweetOutput = df.tweets})
  uiOutput(
    output$pageStub <- renderUI(
      fluidPage(
        fluidRow(
          renderDataTable({data()}, options = list(lengthMenu = c(10, 30, 50), pageLength = 5))))))}

but it shows the result on the same page as shown here

enter image description here

the second code I tried shinyBS library but I think the window is too small

UI:

ui = fluidPage(
  theme = shinytheme("cerulean"),
  mainPanel(

    div(align = "center", style="margin-left:500px",
        radioButtons("typeInput", "Extract tweets by: ",list("Hashtag" = "hashtag", "Twitter Username"= "username"),inline=T),
          textInput("hashtagInput", "Enter search string","", placeholder = "input search string"),
        conditionalPanel(
          condition = "input.typeInput == 'username'",
          textInput("usernameInput", "Username", placeholder = "input username")),
        sliderInput("numberInput", "Select number of tweets",min = 0, max = 3000, value = 100),
          br(),
        actionButton("goButton", "Search", icon("twitter"),
                     style="color: #fff; background-color: #337ab7"),

        bsModal("modalExample", "Your result", "goButton", size = "large",dataTableOutput("tweetTable"))
    )))

server:

server = function(input, output)
{
  data = eventReactive(input$goButton, {

    if (input$typeInput == "hashtag") 
    {
      tweetOutput = searchThis(search_string = input$hashtagInput,
                                      number.of.tweets = input$numberInput)
    } 
    else if (input$typeInput == "username") 
    {
      tweetOutput = userTL(user.name = input$usernameInput,number.of.tweets = input$numberInput)
    }
    else {}
    library(twitteR)
    df.tweets = data.frame(tweetOutput)
    tweetOutput = df.tweets

  })

 output$tweetTable =renderDataTable({data()}, options = list(lengthMenu = c(10, 30, 50), pageLength = 5))
}

as shown here:

enter image description here

and here is the search function that I called:

searchThis = function(search_string,number.of.tweets = 100)
{
  search_tweets(search_string,n = number.of.tweets, lang = "en")
}


userTL = function(user.name,number.of.tweets = 100)
{
  userTimeline(user.name,n = number.of.tweets)
}

is there any other way to do this? thank you

Upvotes: 1

Views: 199

Answers (1)

gdevaux
gdevaux

Reputation: 2505

If you want to use modals, you can modify the width so it's full-screen with the following line in the UI :

tags$head(tags$style(".modal-dialog{ width:100%; overflow-x: scroll;}"))
# width :100% enables you to choose the width of the modal, it could be 95%,50% ...
# overflow-x:scroll displays a horizontal scrollbar if the content is too large for the modal

You UI would be

ui = fluidPage(
  theme = shinytheme("cerulean"),
  mainPanel(

  tags$head(tags$style(".modal-dialog{ width:100%; overflow-x: scroll;}")),

    div(align = "center", style="margin-left:500px",
        radioButtons("typeInput", "Extract tweets by: ",list("Hashtag" = "hashtag", "Twitter Username"= "username"),inline=T),
          textInput("hashtagInput", "Enter search string","", placeholder = "input search string"),
        conditionalPanel(
          condition = "input.typeInput == 'username'",
          textInput("usernameInput", "Username", placeholder = "input username")),
        sliderInput("numberInput", "Select number of tweets",min = 0, max = 3000, value = 100),
          br(),
        actionButton("goButton", "Search", icon("twitter"),
                     style="color: #fff; background-color: #337ab7"),

        bsModal("modalExample", "Your result", "goButton", size = "large",dataTableOutput("tweetTable"))
    )))

Upvotes: 1

Related Questions