diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.html b/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.html
index f2416b7700..77dfc9e853 100644
--- a/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.html
+++ b/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.html
@@ -1,11 +1,10 @@
+ [class.typeahead-widget__invalid]="!field.isValid" id="typehead-div">
diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.spec.ts b/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.spec.ts
index 5cb375a497..03e0b906d2 100644
--- a/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.spec.ts
+++ b/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.spec.ts
@@ -210,7 +210,7 @@ describe('TypeaheadWidget', () => {
it('should get filtered options', () => {
let options: FormFieldOption[] = [
{ id: '1', name: 'Item one' },
- { id: '2', name: 'Item two'}
+ { id: '2', name: 'Item two' }
];
widget.field.options = options;
widget.value = 'tw';
@@ -275,8 +275,8 @@ describe('TypeaheadWidget', () => {
it('should reset fields when flushing missing option value', () => {
widget.field.options = [
- {id: '1', name: 'Item one'},
- {id: '2', name: 'Item two'}
+ { id: '1', name: 'Item one' },
+ { id: '2', name: 'Item two' }
];
widget.value = 'Missing item';
widget.flushValue();
@@ -287,8 +287,8 @@ describe('TypeaheadWidget', () => {
it('should reset fields when flushing incorrect value', () => {
widget.field.options = [
- {id: '1', name: 'Item one'},
- {id: '2', name: 'Item two'}
+ { id: '1', name: 'Item one' },
+ { id: '2', name: 'Item two' }
];
widget.field.value = 'Item two';
widget.value = 'Item two!';
@@ -308,4 +308,33 @@ describe('TypeaheadWidget', () => {
expect(widget.field.value).toBeNull();
});
+ it('should emit field change event on item click', () => {
+ let event = jasmine.createSpyObj('event', ['preventDefault']);
+ let fakeField = new FormFieldModel(new FormModel(), {id: 'fakeField', value: 'fakeValue'});
+ widget.field = fakeField;
+ let item = {id: 'fake-id-opt', name: 'fake-name-opt'};
+ widget.onItemClick(item, event);
+
+ widget.fieldChanged.subscribe((field) => {
+ expect(field).toBeDefined();
+ expect(field.id).toEqual('fakeField');
+ expect(field.value).toEqual('fake-id-opt');
+ });
+ });
+
+ it('should emit field change event on blur', (done) => {
+ spyOn(widget, 'flushValue').and.stub();
+ let fakeField = new FormFieldModel(new FormModel(), {id: 'fakeField', value: 'fakeValue'});
+ widget.field = fakeField;
+ widget.onBlur();
+
+ setTimeout(() => {
+ widget.fieldChanged.subscribe((field) => {
+ expect(field).toBeDefined();
+ expect(field.id).toEqual('field-id');
+ expect(field.value).toEqual('field-value');
+ });
+ done();
+ }, 200);
+ });
});
diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.ts b/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.ts
index 8bdbca48b9..8b7cc36048 100644
--- a/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.ts
+++ b/ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.ts
@@ -81,6 +81,7 @@ export class TypeaheadWidget extends WidgetComponent implements OnInit {
onBlur() {
setTimeout(() => {
this.flushValue();
+ this.checkVisibility(this.field);
}, 200);
}
@@ -108,6 +109,7 @@ export class TypeaheadWidget extends WidgetComponent implements OnInit {
if (item) {
this.field.value = item.id;
this.value = item.name;
+ this.checkVisibility(this.field);
}
if (event) {
event.preventDefault();