material_text_box: Create a shinymaterial text box

In shinymaterial: Implement Material Design in Shiny Applications

Description

Build a shinymaterial text box.

Usage

material_text_box(input_id, label, value = "", color = NULL, icon = NULL)

Arguments

input_id	String. The input identifier used to access the value.
label	String. The text box label.
value	String. Initial value.
color	String. The accent color of the text box. Leave empty for the default color. Visit https://materializecss.com/color.html for a list of available colors. This input requires using color hex codes, rather than the word form. E.g., "#ef5350", rather than "red lighten-1".
icon	String. The name of the icon. Leave empty for no icon. Visit https://materializecss.com/icons.html for a list of available icons.

See Also

update_material_text_box

Examples

material_text_box(
  input_id = "example_text_box",
  label = "text box",
  icon = "search",
  color = "#ef5350"
)

Example output

<script>$(document).ready(function () {

    var shinyMaterialTextBox = new Shiny.InputBinding();
    $.extend(shinyMaterialTextBox, {
        find: function (scope) {
            return $(scope).find(".shiny-material-text-box");
        },
        getValue: function (el) {
            return $(el).val();
        },
        subscribe: function (el, callback) {
            $(el).on("change.shiny-material-text-box", function (e) {
                callback();
            });
        },
        unsubscribe: function (el) {
            $(el).off(".shiny-material-text-box");
        }
    });

    Shiny.inputBindings.register(shinyMaterialTextBox);
});</script>
<div class="input-field" id="example_text_box_text_box">
  <i class="material-icons prefix">search</i>
  <input id="example_text_box" type="text" class="validate" value=""/>
  <label for="example_text_box">text box</label>
</div>

shinymaterial documentation built on Sept. 1, 2020, 1:07 a.m.