LP#1775466 Combobox repairs
authorBill Erickson <berickxx@gmail.com>
Mon, 2 Jul 2018 15:40:47 +0000 (11:40 -0400)
committerBill Erickson <berickxx@gmail.com>
Mon, 2 Jul 2018 15:42:08 +0000 (11:42 -0400)
Signed-off-by: Bill Erickson <berickxx@gmail.com>
Open-ILS/src/eg2/src/app/share/combobox/combobox.component.html
Open-ILS/src/eg2/src/app/share/combobox/combobox.component.ts
Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html
Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts

index 879a023..5c31968 100644 (file)
@@ -7,6 +7,7 @@
 <div class="d-flex">
   <input type="text" 
     class="form-control"
+    [ngClass]="{'text-success font-italic font-weight-bold': selected && selected.freetext}"
     [placeholder]="placeholder"
     [(ngModel)]="selected" 
     [ngbTypeahead]="filter"
index e08369f..2ab9b13 100644 (file)
@@ -1,3 +1,8 @@
+/**
+ * <eg-combobox [allowFreeText]="true" [entries]="comboboxEntryList"/>
+ *  <!-- see also <eg-combobox-entry> -->
+ * </eg-combobox>
+ */
 import {Component, OnInit, Input, Output, ViewChild, EventEmitter, ElementRef} from '@angular/core';
 import {Observable} from 'rxjs/Observable';
 import {map} from 'rxjs/operators/map';
@@ -51,6 +56,9 @@ export class ComboboxComponent implements OnInit {
     // onChange() is NOT fired when applying the default value
     @Input() startId: any;
 
+    // True if a default selection has been made.
+    defaultSelectionApplied: boolean;
+
     @Input() set entries(el: ComboboxEntry[]) {
         this.entrylist = el;
         this.applySelection();
@@ -71,6 +79,7 @@ export class ComboboxComponent implements OnInit {
         this.click$ = new Subject<string>();
         this.onChange = new EventEmitter<ComboboxEntry>();
         this.freeTextId = -1;
+        this.defaultSelectionApplied = false;
 
         this.formatDisplayString = (result: ComboboxEntry) => {
             return result.label.trim();
@@ -89,13 +98,25 @@ export class ComboboxComponent implements OnInit {
 
     // Apply a default selection where needed
     applySelection() {
+
+        if (this.defaultSelectionApplied 
+            || !this.entrylist || this.entrylist.length === 0) {
+            // Avoid unnecessary processing.  Also as the page renders,
+            // the entrylist may be empty at times, avoid any attempts
+            // to apply selection during that time
+            return;
+        }
+
         if (this.startId) {
-            const entry = this.entrylist.filter(e => e.id === entry.id)[0];
+            const entry = 
+                this.entrylist.filter(e => e.id === this.startId)[0];
             if (entry) {
                 this.selected = entry;
+                this.defaultSelectionApplied = true;
             }
         } else if (this.selectFirst) {
             this.selected = this.entrylist[0];
+            this.defaultSelectionApplied = true;
         }
     }
 
@@ -132,7 +153,6 @@ export class ComboboxComponent implements OnInit {
     // This only fires when an item in the list is selected, not when
     // the value is cleared or free-text is used.
     selectorChanged(selEvent: NgbTypeaheadSelectItemEvent) {
-        console.log('selector changed');
         this.onChange.emit(selEvent.item.id);
     }
 
index 84fb330..739184d 100644 (file)
@@ -39,7 +39,8 @@
    <button class="btn btn-info" (click)="testToast()">Test Toast Message</button>
   </div>
   <div class="col-lg-4">
-    <eg-combobox [entries]="taEntries" placeholder="Combobox..."></eg-combobox>
+    <eg-combobox [selectFirst]="true" [allowFreeText]="true" 
+      [entries]="taEntries" placeholder="Combobox..."></eg-combobox>
   </div>
 </div>
 <!-- /Progress Dialog Experiments ----------------------------- -->
index 0d428da..9151b1f 100644 (file)
@@ -58,8 +58,6 @@ export class SandboxComponent implements OnInit {
         private toast: ToastService,
         private printer: PrintService
     ) {
-    
-        this.taEntries = [];
     }
 
     ngOnInit() {
@@ -71,8 +69,10 @@ export class SandboxComponent implements OnInit {
         ];
 
         this.pcrud.retrieveAll('cmrcfld', {order_by:{cmrcfld: 'name'}})
-        .subscribe(format => 
-            this.taEntries.push({id: format.id(), label: format.name()}));
+        .subscribe(format => {
+            if (!this.taEntries) { this.taEntries = []; }
+            this.taEntries.push({id: format.id(), label: format.name()})
+        });
 
         this.btSource.getRows = (pager: Pager, sort: any[]) => {