diff --git a/src/assets/css/inputs.css b/src/assets/css/inputs.css
index 5f3948e63..b408e4d23 100644
--- a/src/assets/css/inputs.css
+++ b/src/assets/css/inputs.css
@@ -421,6 +421,25 @@ input:checked + .input-slider:before {
     border-radius: 3px;
 }
 
+.input-body-container {
+    position: relative;
+}
+
+.input-error-popup {
+    position: absolute;
+    right:0;
+    bottom: 100%;
+    margin-bottom: .3rem;
+    
+    padding: .2rem .5rem;
+    
+    font-size: .7rem;
+    color: $brand-danger-color;
+    background-color: #fff;
+    border: 1px solid $brand-danger-color;
+    border-radius: 3px;
+}
+
 .input-error {
     border-color: $brand-danger-color;
 }
@@ -543,6 +562,7 @@ input:checked + .input-slider:before {
 }
 
 .form-group {
+    position: relative;
     margin-bottom: 0.2rem;
 }
 
diff --git a/src/assets/css/styles.css b/src/assets/css/styles.css
index 2756ca033..86fdf48a7 100644
--- a/src/assets/css/styles.css
+++ b/src/assets/css/styles.css
@@ -959,6 +959,24 @@ td.pulse-off input {
  *  Animations
  */
 
+.fade-enter {
+    opacity: 0.01;
+}
+
+.fade-enter.fade-enter-active {
+    opacity: 1;
+    transition: opacity .2s;
+}
+
+.fade-leave {
+    opacity: 1;
+}
+
+.fade-leave.fade-leave-active {
+    opacity: 0.01;
+    transition: opacity .2s;
+ }
+
 .slidein-enter {
     right: -100%;
 }
diff --git a/src/components/widget/DatetimeRange.js b/src/components/widget/DatetimeRange.js
index 049ea9b9d..6bd551dfc 100644
--- a/src/components/widget/DatetimeRange.js
+++ b/src/components/widget/DatetimeRange.js
@@ -55,7 +55,7 @@ class DatetimeRange extends Component {
             ]
         }
         const {startDate, endDate} = this.state;
-        const {onShow, onHide, mandatory} = this.props;
+        const {onShow, onHide, mandatory, validStatus} = this.props;
 
         return (
             <DateRangePicker
@@ -75,8 +75,11 @@ class DatetimeRange extends Component {
             >
                 <button className={
                     'btn btn-block text-xs-left btn-meta-outline-secondary ' +
-                    'btn-distance btn-sm input-icon-container input-primary' +
-                    (mandatory && !startDate && !endDate ? ' input-mandatory ' : '')
+                    'btn-distance btn-sm input-icon-container input-primary ' +
+                    ((mandatory && !startDate && !endDate) ? 
+                        'input-mandatory ' : '') +
+                    ((validStatus && !validStatus.valid) ?
+                        'input-error ' : '')
                 }>
                     {!!startDate && !!endDate ?
                         ' ' + Moment(startDate).format('L') +
diff --git a/src/components/widget/List/List.js b/src/components/widget/List/List.js
index e93858593..9dd66412c 100644
--- a/src/components/widget/List/List.js
+++ b/src/components/widget/List/List.js
@@ -45,7 +45,7 @@ class List extends Component {
     render() {
         const {
             rank, readonly, defaultValue, selected, align, updated, rowId,
-            emptyText, tabIndex, mandatory
+            emptyText, tabIndex, mandatory, validStatus
         } = this.props;
         const {list, loading} = this.state;
 
@@ -65,6 +65,7 @@ class List extends Component {
                 emptyText={emptyText}
                 tabIndex={tabIndex}
                 mandatory={mandatory}
+                validStatus={validStatus}
             />
         )
     }
diff --git a/src/components/widget/List/RawList.js b/src/components/widget/List/RawList.js
index 3bdf89ef4..2ce570270 100644
--- a/src/components/widget/List/RawList.js
+++ b/src/components/widget/List/RawList.js
@@ -247,8 +247,8 @@ class RawList extends Component {
 
     render() {
         const {
-            list, rank, readonly, defaultValue, selected, align, updated, loading,
-            rowId, isModal, tabIndex, disabled, mandatory
+            list, rank, readonly, defaultValue, selected, align, updated, 
+            loading, rowId, isModal, tabIndex, disabled, mandatory, validStatus
         } = this.props;
 
         const {
@@ -266,7 +266,9 @@ class RawList extends Component {
                     'input-dropdown-container ' +
                     (readonly ? 'input-disabled ' : '') +
                     (rowId ? 'input-dropdown-container-static ' : '') +
-                    ((rowId && !isModal) ? 'input-table ' : '')
+                    ((rowId && !isModal) ? 'input-table ' : '') +
+                    (validStatus &&
+                        !validStatus.valid ? 'input-error ' : '')
                 }
             >
                 <div className={
diff --git a/src/components/widget/Lookup/Lookup.js b/src/components/widget/Lookup/Lookup.js
index 31dbbf1c5..516039f43 100644
--- a/src/components/widget/Lookup/Lookup.js
+++ b/src/components/widget/Lookup/Lookup.js
@@ -372,7 +372,7 @@ class Lookup extends Component {
     render() {
         const {
             rank, readonly, defaultValue, placeholder, align, isModal, updated,
-            filterWidget, mandatory, rowId, tabIndex
+            filterWidget, mandatory, rowId, tabIndex, validStatus
         } = this.props;
 
         const {
@@ -389,7 +389,9 @@ class Lookup extends Component {
                     (isOpen ? 'input-focused ' : '') +
                     (readonly ? 'input-disabled ' : '') +
                     (rowId ? 'input-dropdown-container-static ' : '') +
-                    ((rowId && !isModal)? 'input-table ' : '')
+                    ((rowId && !isModal)? 'input-table ' : '') +
+                    (validStatus &&
+                        !validStatus.valid ? 'input-error ' : '')
                 }
             >
                 <div className={
diff --git a/src/components/widget/RawWidget.js b/src/components/widget/RawWidget.js
index c783db5bb..cf7c42b2c 100644
--- a/src/components/widget/RawWidget.js
+++ b/src/components/widget/RawWidget.js
@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
 import Moment from 'moment';
+import ReactCSSTransitionGroup from 'react-addons-css-transition-group';
 
 import DatePicker from './DatePicker';
 import Attributes from './Attributes/Attributes';
@@ -18,7 +19,8 @@ class RawWidget extends Component {
 
         this.state = {
             isEdited: false,
-            cachedValue: null
+            cachedValue: null,
+            errorPopup: false
         }
     }
 
@@ -51,7 +53,8 @@ class RawWidget extends Component {
         if(
             JSON.stringify(widgetData[0].value) !== JSON.stringify(value) ||
             JSON.stringify(widgetData[0].valueTo) !== JSON.stringify(valueTo) ||
-            (cachedValue !== null && (JSON.stringify(cachedValue) !== JSON.stringify(value)))
+            (cachedValue !== null && 
+                (JSON.stringify(cachedValue) !== JSON.stringify(value)))
         ){
 
             if(handlePatch) {
@@ -91,19 +94,52 @@ class RawWidget extends Component {
         );
     }
 
+    handleErrorPopup = (value) => {
+        this.setState({
+            errorPopup: value
+        })
+    }
+
+    getClassnames = (icon) => {
+        const {
+            widgetData, disabled, gridAlign, type, updated, rowId, isModal
+        } = this.props;
+
+        return 'input-block ' +
+            (icon ? 'input-icon-container ' : '') +
+            (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
+            (widgetData[0].validStatus &&
+                !widgetData[0].validStatus.valid ? 'input-error ' : '') +
+            (widgetData[0].mandatory && 
+                widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
+            (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
+            (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
+            (updated ? 'pulse-on ' : 'pulse-off ') +
+            (rowId && !isModal ? 'input-table ' : '');
+    }
+
+    renderErrorPopup = (reason) => {
+        return (
+            <div className="input-error-popup">
+                {reason ? reason : 'Input error'}
+            </div>
+        )
+    }
+
     renderWidget = () => {
         const {
             handleChange, updated, isModal, filterWidget, filterId, id, range,
-            onHide, handleBackdropLock, subentity, subentityId, tabIndex, viewId,
+            onHide, handleBackdropLock, subentity, subentityId, tabIndex, 
             dropdownOpenCallback, autoFocus, fullScreen, widgetType, fields,
             windowType, dataId, type, widgetData, rowId, tabId, icon, gridAlign,
-            entity, onShow, disabled, caption
+            entity, onShow, disabled, caption, viewId
         } = this.props;
 
         const {isEdited} = this.state;
 
         // TODO: API SHOULD RETURN THE SAME PROPERTIES FOR FILTERS
-        const widgetField = filterWidget ? fields[0].parameterName : fields[0].field;
+        const widgetField = filterWidget ? 
+            fields[0].parameterName : fields[0].field;
 
         switch(widgetType){
             case 'Date':
@@ -115,12 +151,17 @@ class RawWidget extends Component {
                         <DatetimeRange
                             onChange={(value, valueTo) =>
                                 this.handlePatch(widgetField,
-                                    value ? Moment(value).format(DATE_FORMAT) : null,
+                                    value ? 
+                                        Moment(value).format(DATE_FORMAT) : 
+                                        null,
                                     null,
-                                    valueTo ? Moment(valueTo).format(DATE_FORMAT) : null
+                                    valueTo ? 
+                                        Moment(valueTo).format(DATE_FORMAT) : 
+                                        null
                                 )
                             }
                             mandatory={widgetData[0].mandatory}
+                            validStatus={widgetData[0].validStatus}
                             onShow={onShow}
                             onHide={onHide}
                             value={widgetData[0].value}
@@ -130,14 +171,7 @@ class RawWidget extends Component {
                     )
                 }else{
                     return (
-                        <div className={'input-icon-container input-block ' +
-                            (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                            (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                            (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
-                            (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
-                            (updated ? 'pulse-on ' : 'pulse-off ') +
-                            (rowId && !isModal ? 'input-table ' : '')
-                        }>
+                        <div className={this.getClassnames(true)}>
                             <DatePicker
                                 ref={c => this.rawWidget = c}
                                 timeFormat={false}
@@ -149,7 +183,8 @@ class RawWidget extends Component {
                                     tabIndex: fullScreen ? -1 : tabIndex
                                 }}
                                 value={widgetData[0].value}
-                                onChange={(date) => handleChange(widgetField, date)}
+                                onChange={(date) => 
+                                    handleChange(widgetField, date)}
                                 patch={(date) => this.handlePatch(
                                     widgetField,
                                     date ?
@@ -165,14 +200,7 @@ class RawWidget extends Component {
                 }
             case 'DateTime':
                 return (
-                    <div className={'input-icon-container input-block ' +
-                        (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                        (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                        (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
-                        (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
-                        (updated ? 'pulse-on ' : 'pulse-off ') +
-                        (((rowId && !isModal)) ? 'input-table ' : '')
-                    }>
+                    <div className={this.getClassnames(true)}>
                         <DatePicker
                             ref={c => this.rawWidget = c}
                             timeFormat={true}
@@ -195,14 +223,7 @@ class RawWidget extends Component {
                 )
             case 'Time':
                 return (
-                    <div className={'input-icon-container input-block ' +
-                        (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
-                        (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
-                        (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                        (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                        (updated ? 'pulse-on ' : 'pulse-off ') +
-                        ((rowId && !isModal) ? 'input-table ' : '')
-                    }>
+                    <div className={this.getClassnames(true)}>
                         <DatePicker
                             ref={c => this.rawWidget = c}
                             timeFormat={true}
@@ -251,6 +272,7 @@ class RawWidget extends Component {
                         tabIndex={fullScreen ? -1 : tabIndex}
                         viewId={viewId}
                         autoFocus={autoFocus}
+                        validStatus={widgetData[0].validStatus}
                     />
                 )
             case 'List':
@@ -278,18 +300,13 @@ class RawWidget extends Component {
                         tabIndex={fullScreen ? -1 : tabIndex}
                         viewId={viewId}
                         autoFocus={autoFocus}
+                        validStatus={widgetData[0].validStatus}
                     />
                 )
             case 'Text':
                 return (
                     <div className={
-                            'input-block input-icon-container ' +
-                            (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
-                            (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                            (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
-                            (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                            (updated ? 'pulse-on ' : 'pulse-off ') +
-                            ((rowId && !isModal) ? 'input-table ' : '') +
+                            this.getClassnames(true) +
                             (isEdited ? 'input-focused ' : '')
                         }
                     >
@@ -311,13 +328,7 @@ class RawWidget extends Component {
             case 'LongText':
                 return (
                     <div className={
-                        'input-block ' +
-                        (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
-                        (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
-                        (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                        (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                        (updated ? 'pulse-on ' : 'pulse-off ') +
-                        ((rowId && !isModal) ? 'input-table ' : '') +
+                        this.getClassnames() +
                         (isEdited ? 'input-focused ' : '')
                     }>
                         <textarea
@@ -336,13 +347,7 @@ class RawWidget extends Component {
             case 'Integer':
                 return (
                     <div className={
-                        'input-block ' +
-                        (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
-                        (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
-                        (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                        (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                        (updated ? ' pulse-on' : ' pulse-off') +
-                        ((rowId && !isModal) ? 'input-table ' : '') +
+                        this.getClassnames() +
                         (isEdited ? 'input-focused ' : '')
                     }>
                         <input
@@ -363,13 +368,7 @@ class RawWidget extends Component {
             case 'Number':
                 return (
                     <div className={
-                        'input-block ' +
-                        (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
-                        (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
-                        (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                        (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                        (updated ? 'pulse-on ' : 'pulse-off ') +
-                        ((rowId && !isModal) ? 'input-table ' : '') +
+                        this.getClassnames() +
                         (isEdited ? 'input-focused ' : '')
                     }>
                         <input
@@ -388,13 +387,7 @@ class RawWidget extends Component {
             case 'Amount' :
                 return (
                     <div className={
-                        'input-block ' +
-                        (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
-                        (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
-                        (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                        (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                        (updated ? 'pulse-on ' : 'pulse-off ') +
-                        ((rowId && !isModal) ? 'input-table ' : '') +
+                        this.getClassnames() +
                         (isEdited ? 'input-focused ' : '')
                     }>
                         <input
@@ -415,13 +408,7 @@ class RawWidget extends Component {
             case 'Quantity':
                 return (
                     <div className={
-                        'input-block ' +
-                        (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
-                        (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
-                        (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                        (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                        (updated ? 'pulse-on ' : 'pulse-off ') +
-                        ((rowId && !isModal) ? 'input-table ' : '') +
+                        this.getClassnames() +
                         (isEdited ? 'input-focused ' : '')
                     }>
                         <input
@@ -442,13 +429,7 @@ class RawWidget extends Component {
             case 'CostPrice':
                 return (
                     <div className={
-                        'input-block ' +
-                        (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
-                        (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
-                        (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                        (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                        (updated ? 'pulse-on ' : 'pulse-off ') +
-                        ((rowId && !isModal) ? 'input-table ' : '') +
+                        this.getClassnames() +
                         (isEdited ? 'input-focused ' : '')
                     }>
                         <input
@@ -498,6 +479,8 @@ class RawWidget extends Component {
                             'input-switch ' +
                             (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
                             (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
+                            (validStatus &&
+                                !validStatus.valid ? 'input-error ' : '') +
                             (rowId && !isModal ? 'input-table ' : '')
                         }
                         tabIndex={fullScreen ? -1 : tabIndex}
@@ -625,7 +608,9 @@ class RawWidget extends Component {
             widgetType
         } = this.props;
 
+        const {errorPopup} = this.state;
         const widgetBody = this.renderWidget();
+        const {validStatus} = widgetData[0];
 
         // Unsupported widget type
         if(!widgetBody){
@@ -665,9 +650,21 @@ class RawWidget extends Component {
                         ((type === 'primary' || noLabel) ? 'col-sm-12 ' : 'col-sm-9 ') +
                         (fields[0].devices ? 'form-group-flex ': '')
                     }
+                    onMouseEnter={() => this.handleErrorPopup(true)}
+                    onMouseLeave={() => this.handleErrorPopup(false)}
                 >
-                    {widgetBody}
-
+                    <div className="input-body-container">
+                        <ReactCSSTransitionGroup
+                            transitionName="fade"
+                            transitionEnterTimeout={200}
+                            transitionLeaveTimeout={200}
+                        >
+                            {(errorPopup && validStatus && !validStatus.valid) &&
+                                this.renderErrorPopup(validStatus.reason)
+                            }
+                        </ReactCSSTransitionGroup>
+                        {widgetBody}
+                    </div>
                     {fields[0].devices && !widgetData[0].readonly &&
                         <DevicesWidget
                             devices={fields[0].devices}