Fork me on GitHub

jQuery Input Group

A JQuery Plugin which dresses a structured HTML form input group with error, warning and success statuses. Designed for use with Bootstrap form inputs.

See GitHub for full documentation.


Set Feedback
$('form-group').inputGroup({
  error: 'error message'
});

$('form-group').inputGroup({
  success: 'success message'
});

$('form-group').inputGroup({
  warning: 'warning message';
});


Disable Icon
$('form-group').inputGroup({
  noIcon: true,
  success: 'success message'
});


Set Status without feedback message
$('form-group').inputGroup({
  success: null
});


Set Multiple Inputs at once by Input Name
$('multiple-form-groups').inputGroup({
  noIcon: ['inputA'],
  warning: {
    inputA: 'warning message'
  },
  success: {
    inputB: null
  }
});


Set a Validate Function to be called on input blur
$('form-group').inputGroup({
  validate: function (inputValues, $blurredElem) {
    return { error: 'error message' };
  }
});


Progressive Validate

Try working your way through the form by intentionally creating errors

$('multiple-form-groups').inputGroup({
  progessiveValidate: function (inputValues, $blurredElement) {
    return {
      error: {
        email: 'email error',
        password: 'password error',
        passwordConfirm: 'passwordConfirm error'
      }
    };
  }
});