From 35cf13c59d7b1a851e46b537a4f0356a9e4bc3fc Mon Sep 17 00:00:00 2001
From: Jane Sandberg <sandbej@linnbenton.edu>
Date: Wed, 12 Dec 2018 08:35:54 -0800
Subject: [PATCH] LP1807523: Adding some randomness to DOM ID generation
Ensures ID values across multiple FmEditor instances in a page will not
collide.
Signed-off-by: Jane Sandberg <sandbej@linnbenton.edu>
Signed-off-by: Bill Erickson <berickxx@gmail.com>
---
.../app/share/fm-editor/fm-editor.component.html | 22 +++++++++++-----------
.../src/app/share/fm-editor/fm-editor.component.ts | 5 +++++
2 files changed, 16 insertions(+), 11 deletions(-)
diff --git a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html
index bcd995d3f3..4aab72d7b4 100644
--- a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html
+++ b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html
@@ -11,7 +11,7 @@
<form #fmEditForm="ngForm" role="form" class="form-validated common-form striped-odd">
<div class="form-group row" *ngFor="let field of fields">
<div class="col-lg-3 offset-lg-1">
- <label for="rec-{{field.name}}">{{field.label}}</label>
+ <label for="{{idPrefix}}-{{field.name}}">{{field.label}}</label>
</div>
<div class="col-lg-7">
@@ -30,7 +30,7 @@
<input *ngIf="field.datatype == 'id' && pkeyIsEditable"
class="form-control"
name="{{field.name}}"
- id="rec-{{field.name}}"
+ id="{{idPrefix}}-{{field.name}}"
placeholder="{{field.label}}..."
i18n-placeholder
[readonly]="field.readOnly"
@@ -41,7 +41,7 @@
<input *ngIf="field.datatype == 'text' || field.datatype == 'interval'"
class="form-control"
name="{{field.name}}"
- id="rec-{{field.name}}"
+ id="{{idPrefix}}-{{field.name}}"
placeholder="{{field.label}}..."
i18n-placeholder
[readonly]="field.readOnly"
@@ -51,7 +51,7 @@
<span *ngIf="field.datatype == 'timestamp'">
<eg-date-select
- domId="rec-{{field.name}}"
+ domId="{{idPrefix}}-{{field.name}}"
(onChangeAsIso)="record[field.name]($event)"
initialIso="{{record[field.name]()}}">
</eg-date-select>
@@ -61,7 +61,7 @@
class="form-control"
type="number"
name="{{field.name}}"
- id="rec-{{field.name}}"
+ id="{{idPrefix}}-{{field.name}}"
placeholder="{{field.label}}..."
i18n-placeholder
[readonly]="field.readOnly"
@@ -73,7 +73,7 @@
class="form-control"
type="number" step="0.1"
name="{{field.name}}"
- id="rec-{{field.name}}"
+ id="{{idPrefix}}-{{field.name}}"
placeholder="{{field.label}}..."
i18n-placeholder
[readonly]="field.readOnly"
@@ -87,7 +87,7 @@
class="form-control"
type="number" step="0.1"
name="{{field.name}}"
- id="rec-{{field.name}}"
+ id="{{idPrefix}}-{{field.name}}"
[readonly]="field.readOnly"
[required]="field.isRequired()"
[ngModel]="record[field.name]() | currency"/>
@@ -96,7 +96,7 @@
class="form-control"
type="number" step="0.1"
name="{{field.name}}"
- id="rec-{{field.name}}"
+ id="{{idPrefix}}-{{field.name}}"
placeholder="{{field.label}}..."
i18n-placeholder
[readonly]="field.readOnly"
@@ -109,7 +109,7 @@
class="form-check-input"
type="checkbox"
name="{{field.name}}"
- id="rec-{{field.name}}"
+ id="{{idPrefix}}-{{field.name}}"
[readonly]="field.readOnly"
[ngModel]="record[field.name]()"
(ngModelChange)="record[field.name]($event)"/>
@@ -119,7 +119,7 @@
<select
class="form-control"
name="{{field.name}}"
- id="rec-{{field.name}}"
+ id="{{idPrefix}}-{{field.name}}"
[disabled]="field.readOnly"
[required]="field.isRequired()"
[ngModel]="record[field.name]()"
@@ -132,7 +132,7 @@
<eg-org-select *ngIf="field.datatype == 'org_unit'"
placeholder="{{field.label}}..."
i18n-placeholder
- domId="rec-{{field.name}}"
+ domId="{{idPrefix}}-{{field.name}}"
[limitPerms]="modePerms[mode]"
[applyDefault]="field.orgDefaultAllowed"
[initialOrgId]="record[field.name]()"
diff --git a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.ts b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.ts
index 308218a96c..3ad4892cb7 100644
--- a/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.ts
+++ b/Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.ts
@@ -110,6 +110,8 @@ export class FmRecordEditorComponent
if (id) { this.recId = id; }
}
+ idPrefix: string;
+
constructor(
private modal: NgbModal, // required for passing to parent
private idl: IdlService,
@@ -124,6 +126,9 @@ export class FmRecordEditorComponent
this.listifyInputs();
this.idlDef = this.idl.classes[this.idlClass];
this.recordLabel = this.idlDef.label;
+
+ // Add some randomness to the generated DOM IDs to ensure against clobbering
+ this.idPrefix = 'fm-editor-' + Math.floor(Math.random() * 100000);
}
// Opening dialog, fetch data.
--
2.11.0