Use runjs in an observeEvent, run only the second time

Hello, I want to make a scroll in my Shiny app at the bottom of the screen after a fileInput, but the runjs code runs only the second time as I ve upload the file . (but not the first time)
UI

column(12,
                        fluidRow(     
                          column(width = 6,align="center",
                                 h4("Data second table"),
                                 fileInput("dataFile2",label = NULL,
                                           buttonLabel = "Browse...",
                                           placeholder = "No file selected",
                                           multiple = FALSE,
                                 )),

bottom of the UI
tags$div(id="bottom", "I'm at the bottom, javascript can scroll me into view"),

Server

observeEvent(input$dataFile2, {
    
    cat(file=stderr(), "Debug on appel l'ouverture de selection de fichier", "\n")
   # js$refocus("downloadDataCSV") 
   
    runjs('document.getElementById("bottom").scrollIntoView();')
  })

Hi!

To help us help you, could you please prepare a reproducible example (reprex) illustrating your issue? Please have a look at this guide, to see how to create one:

Hello, this is a minimum example of the problem, and I see that the runjs doesn't run.
runjs('document.getElementById("top").scrollIntoView();')
Do you have an idea to make it functionnal ?

library(shiny)
library(shinyjs)
library(shinydashboard)
library(DT)
library(shinyFeedback)
ui <- fluidPage(
      fileInput("file1", "Choose CSV File",
                accept = c(
                  "text/csv",
                  "text/comma-separated-values,text/plain",
                  ".csv")),
                checkboxInput("header1", "Header", TRUE),
      
      tags$hr(),
      fileInput("file2", "Choose CSV File",
                accept = c(
                  "text/csv",
                  "text/comma-separated-values,text/plain",
                  ".csv")),
      checkboxInput("header2", "Header", TRUE),
      tags$div(id="top", "I'm at the top, javascript can scroll me into view"),
      tags$br(),
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tableOutput("contents1"),
      tableOutput("contents2"),
      tags$br(),
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
      tags$br(),      
     
      tags$div(id="bottom", "I'm at the bottom, javascript can scroll me into view"),
      )


server <- function(input, output) {
  observeEvent(input$file1, {
    runjs('document.getElementById("bottom").scrollIntoView();')
    
  })
  
  observeEvent(input$file2, {
    runjs('document.getElementById("top").scrollIntoView();')
    
  })
  output$contents1 <- renderTable({
    inFile <- input$file1
    
    if (is.null(inFile))
      return(NULL)
    
    read.csv(inFile$datapath, header = input$header1)
  })
  
  output$contents2 <- renderTable({
    inFile <- input$file2
    
    if (is.null(inFile))
      return(NULL)
    
    read.csv(inFile$datapath, header = input$header2)
  })
}

shinyApp(ui, server)

shinyjs requires useShinyjs() in the ui

Hello Nirgrahamuk, you are right, I've updated with useShinyjs() and I ve the problem that the "runjs scrollview" runs only after a first upload of the file choosed in the inputfile. Have you already had such a problem ?

I dont understand.
File is uploaded and then the scroll happens.
What is not desired about this?

I ve tried, the runjs scrollview will run really the second time of a upload, and not the first time, you 'll see the issue well if you add sometags$br(), to be out of the screen.

I don't know what to tell you.
It works immediately for me.
I load a first file, my browser is scrolled...

This topic was automatically closed 54 days after the last reply. New replies are no longer allowed.

If you have a query related to it or one of the replies, start a new topic and refer back with a link.