Focus name inputForm when Add modal of propertydefinitions is shown

Signed-off-by: Philipp Meyer <meyer.github@gmail.com>
eclipse · Oct 11, 2017 · f6b2577 · f6b2577
1 parent 41fea37
commit f6b2577
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 5 deletions.
diff --git a/...rc/app/instance/sharedComponents/propertiesDefinition/propertiesDefinition.component.html b/...rc/app/instance/sharedComponents/propertiesDefinition/propertiesDefinition.component.html
@@ -37,7 +37,8 @@
     <div>
         <div *ngIf="(resourceApiData.selectedValue === propertiesEnum.Element
             || resourceApiData.selectedValue === propertiesEnum.Type)">
-            <ng-select [items]="selectItems" (selected)="xmlValueSelected($event)" [active]="[activeElement]"></ng-select>
+            <ng-select [items]="selectItems" (selected)="xmlValueSelected($event)"
+                       [active]="[activeElement]"></ng-select>
         </div>
 
         <div *ngIf="resourceApiData.selectedValue === propertiesEnum.Custom">
@@ -60,22 +61,25 @@
                                [(ngModel)]="resourceApiData.winerysPropertiesDefinition.elementName">
                     </div>
                     <div class="wrapperTabButtom">
-                        <winery-namespace-selector [(ngModel)]="resourceApiData.winerysPropertiesDefinition.namespace"></winery-namespace-selector>
+                        <winery-namespace-selector
+                            [(ngModel)]="resourceApiData.winerysPropertiesDefinition.namespace"></winery-namespace-selector>
                     </div>
                 </tab>
             </tabset>
         </div>
     </div>
 </div>
 
-<winery-modal bsModal #addModal="bs-modal" [modalRef]="addModal">
+<winery-modal bsModal #addModal="bs-modal" [modalRef]="addModal"
+              (onShown)="onAddModalShown();" (onHide)="addPropertyFrom.reset();">
     <winery-modal-header [title]="'Add Property'">
     </winery-modal-header>
     <winery-modal-body>
         <form #addPropertyFrom="ngForm" id="addPropertyForm">
             <div class="form-group">
                 <label class="control-label" for="key">Name</label>
-                <input #propName="ngModel"
+                <input #nameInputForm
+                       #propName="ngModel"
                        id="key"
                        class="form-control"
                        type="text"

diff --git a/.../src/app/instance/sharedComponents/propertiesDefinition/propertiesDefinition.component.ts b/.../src/app/instance/sharedComponents/propertiesDefinition/propertiesDefinition.component.ts
@@ -6,7 +6,7 @@
  * and are available at http://www.eclipse.org/legal/epl-v20.html
  * and http://www.apache.org/licenses/LICENSE-2.0
  */
-import { Component, OnInit, ViewChild } from '@angular/core';
+import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
 import { InstanceService } from '../../instance.service';
 import { PropertiesDefinitionService } from './propertiesDefinition.service';
 import {
@@ -49,6 +49,7 @@ export class PropertiesDefinitionComponent implements OnInit {
     validatorObject: WineryValidatorObject;
     @ViewChild('confirmDeleteModal') confirmDeleteModal: ModalDirective;
     @ViewChild('addModal') addModal: ModalDirective;
+    @ViewChild('nameInputForm') nameInputForm: ElementRef;
 
     constructor(private sharedData: InstanceService, private service: PropertiesDefinitionService,
                 private notify: WineryNotificationService) {
@@ -234,6 +235,10 @@ export class PropertiesDefinitionComponent implements OnInit {
         this.elementToRemove = null;
     }
 
+    onAddModalShown() {
+        this.nameInputForm.nativeElement.focus();
+    }
+
     // endregion
 
     // region ########## Private Methods ##########