Input Group

Documentation

JavaScript

var Components = require("gd-sprest-bs").Components;

// Create the inputGroup
var el = document.querySelector("#inputGroup");
var inputGroup = Components.inputGroup({
    el: el,
    label: "My Name:",
    value: "First Last",
    onChange: function(value, ev) {
        console.log("The value is: " + value);
    }
});

TypeScript

import { Components } from "gd-sprest-bs";

// Create the inputGroup
let el = document.querySelector("#inputGroup");
let inputGroup = Components.inputGroup({
    el: el,
    label: "My Name:",
    value: "First Last",
    onChange: (value, ev) => {
        console.log("The value is: " + value);
    }
});

Web Component

// Return the input group properties return { onChange: onChangeEvent }
<script type="text/javascript" src="https://unpkg.com/gd-sprest-bs/wc/dist/gd-sprest-bs.js"></script>
<bs-input-group label="My Name" value="First Last">
    // Return the input group properties
    return {
        onChange: function(item, ev) {
            console.log("The selected value is: " + item.text);
        }
    }
</bs-input-group>

References

InputGroup(props:IInputGroupProps):IInputGroup

InputGroupTypes

Name Value
Email 1
File 2
Password 3
TextArea 4
TextField 5

IInputGroup

Name Returns Description
el Element The jquery element.

IinputGroupProps

Name Type Description
appendedLabel string The appended text field label.
className string The class name to apply to input group.
description string The text field description.
el HTMLElement The element to render the input group to.
id string The text field id.
isLarge boolean Adds the ‘inputGroup-lg’ class name.
isSmall boolean Adds the ‘inputGroup-sm’ class name.
label string The text field label.
placeholder string The text field placeholder.
prependedLabel string The prepended text field label.
type number The text field type. Reference the InputGroupTypes enumerator
value string The text field value.