How to create TextArea as input in a Shiny webapp in R? - r

Question

I am trying to create simple webapp where I want to take in multiline input from user using HTML textarea control. Is there any out of the box way of creating such an input control in Shiny?
Help page of textInput doesn't show much options
textInput {shiny} R Documentation
Create a text input control
Description
Create an input control for entry of unstructured text values
Usage
textInput(inputId, label, value = "")
Arguments
inputId
Input variable to assign the control's value to
label
Display label for the control
value
Initial value
Value
A text input control that can be added to a UI definition.
Examples
textInput("caption", "Caption:", "Data Summary")

Answer 1

You can add a textarea using tags and it should be picked up by Shiny automatically:
tags$textarea(id="foo", rows=3, cols=40, "Default value")
Or if you're more comfortable with straight HTML you can also do
HTML('<textarea id="foo" rows="3" cols="40">Default value</textarea>')
In either case, input$foo should reflect the textarea's value.

Answer 2

For benefit of others, I will post how I solved the problem using custom UI control following Shiny tutorial
Firstly, I crearted textarea.js file as follows
$(document).on("click", "textarea.inputTextarea", function(evt) {
// evt.target is the button that was clicked
var el = $(evt.target);
// Raise an event to signal that the value changed
el.trigger("change");
});
var inputTextareaBinding = new Shiny.InputBinding();
$.extend(inputTextareaBinding, {
find: function(scope) {
return $(scope).find(".inputTextarea");
},
getValue: function(el) {
return $(el).text();
},
setValue: function(el, value) {
$(el).text(value);
},
subscribe: function(el, callback) {
$(el).on("change.inputTextareaBinding", function(e) {
callback();
});
},
unsubscribe: function(el) {
$(el).off(".inputTextareaBinding");
}
});
Shiny.inputBindings.register(inputTextareaBinding);
Then I added following function in ui.R of shiny webapp before shinyUI() is called
inputTextarea <- function(inputId, value="", nrows, ncols) {
tagList(
singleton(tags$head(tags$script(src = "textarea.js"))),
tags$textarea(id = inputId,
class = "inputtextarea",
rows = nrows,
cols = ncols,
as.character(value))
)
}
Then I used above defined function to create the desired textarea control element in ui.R
shinyUI(pageWithSidebar(
# Application title
headerPanel("Test Header Panel"),
sidebarPanel(),
mainPanel(
inputTextarea('exampleTextarea', '',20,35 )
)
))

Answer 3

May or may not be relevant here, but I made the shinyAce package to wrap up and expose the Ace text editor in Shiny. Ace is primarily used for code editing (complete with syntax highlighting for a variety of languages), but provides a text-area-like interface for writing composing multi-line text/code.
You can check out the example to see if that might be what you're looking for. (Try different "modes" for syntax highlighting and themes for color combinations.)

Answer 4

From version 0.14 shiny has an implementation of textAreaInput.

Answer 5

Building off of Joe's answer (https://stackoverflow.com/a/14452837/5776618), you can also nest tags into your own function to achieve the same output as the standard Shiny built-in input functions.
textareaInput <- function(id, label, value, rows=20, cols=35, class="form-control"){
tags$div(
class="form-group shiny-input-container",
tags$label('for'=id,label),
tags$textarea(id=id,class=class,rows=rows,cols=cols,value))
}
This is a way to avoid writing the JS code (if you want to) while still...
having a function that calls the same way the built-in Shiny inputs are called, and
includes the div, label, and Bootstrap's form-control CSS style (so that it looks like the built-in Shiny input controls)
Using the function is same as if you are using the built-in or if you built a custom UI.
textareaInput("textareaID","Text Area Label", "Insert text here...", rows = 20, cols = 35)

Answer 6

Here's a quick solution that preserves the shiny input feel, but allows custom number of columns:
textareaInput <- function(inputID, label, value="", rows=10, columns=80) {
HTML(paste0('<div class="form-group shiny-input-container">
<label for="', inputID, '">', label,'</label>
<textarea id="', inputID, '" rows="', rows,'" cols="',
columns,'">', value, '</textarea></div>'))
}
In your ui.R script, you can add:
textareaInput("shazam", "My text box")
Note: To get a Bootstrap feel to the textarea, you can use:
textareaInput <- function(inputID, label, value="", rows=10) {
HTML(paste0('<div class="form-group shiny-input-container">
<label for="', inputID, '">', label,'</label>
<textarea class="form-control" id="', inputID,
'" rows="', rows, '">', value, '</textarea></div>'))
}