Create a Framework7 autocomplete input

Build a Framework7 autocomplete input

f7AutoComplete(
  inputId,
  label,
  placeholder = NULL,
  value = choices[1],
  choices,
  openIn = c("popup", "page", "dropdown"),
  typeahead = TRUE,
  expandInput = TRUE,
  closeOnSelect = FALSE,
  dropdownPlaceholderText = NULL,
  multiple = FALSE
)

Arguments

inputId	Autocomplete input id.
label	Autocomplete label.
placeholder	Text to write in the container.
value	Autocomplete initial value, if any.
choices	Autocomplete choices.
openIn	Defines how to open Autocomplete, can be page or popup (for Standalone) or dropdown.
typeahead	Enables type ahead, will prefill input value with first item in match. Only if openIn is "dropdown".
expandInput	If TRUE then input which is used as item-input in List View will be expanded to full screen wide during dropdown visible. Only if openIn is "dropdown".
closeOnSelect	Set to true and autocomplete will be closed when user picks value. Not available if multiple is enabled. Only works when openIn is 'popup' or 'page'.
dropdownPlaceholderText	Specify dropdown placeholder text. Only if openIn is "dropdown".
multiple	Whether to allow multiple value selection. Only works when openIn is 'popup' or 'page'.

Author

David Granjon, dgranjon@ymail.com

Examples

if(interactive()){
 library(shiny)
 library(shinyMobile)

 shinyApp(
   ui = f7Page(
    title = "My app",
    f7SingleLayout(
     navbar = f7Navbar(title = "f7AutoComplete"),
     f7AutoComplete(
      inputId = "myautocomplete1",
      placeholder = "Some text here!",
      dropdownPlaceholderText = "Try to type Apple",
      label = "Type a fruit name",
      openIn = "dropdown",
      choices = c('Apple', 'Apricot', 'Avocado', 'Banana', 'Melon',
       'Orange', 'Peach', 'Pear', 'Pineapple')
     ),
     textOutput("autocompleteval1"),
     f7AutoComplete(
      inputId = "myautocomplete2",
      placeholder = "Some text here!",
      openIn = "popup",
      multiple = TRUE,
      label = "Type a fruit name",
      choices = c('Apple', 'Apricot', 'Avocado', 'Banana', 'Melon',
                  'Orange', 'Peach', 'Pear', 'Pineapple')
     ),
     verbatimTextOutput("autocompleteval2")
    )
   ),
   server = function(input, output) {
    observe({
     print(input$myautocomplete1)
     print(input$myautocomplete2)
    })
    output$autocompleteval1 <- renderText(input$myautocomplete1)
    output$autocompleteval2 <- renderPrint(input$myautocomplete2)
   }
 )
}