zware/awx
1
0
Fork 0
mirror of https://github.com/ZwareBear/awx.git synced 2026-04-21 23:41:49 -05:00
Code Issues Packages Projects Releases Wiki Activity

Validate JT add and edit forms client-side

Browse Source 
- Use form generator to add new `helperText` field to show the
character limit next to the label in the UI
- Style helper text like the checkbox text
- Update both `add` and `edit` controllers to handle client-side
validation for the `labels` field.
This commit is contained in:
kialam
2018-08-03 11:12:35 -04:00
parent 21c364d14c
commit 7207d7caf4
5 changed files with 137 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
awx/ui/client/src/shared/form-generator.js
View File

@@ -684,6 +684,10 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
html += createCheckbox(options.checkbox);
}
if (options && options.helpertext) {
html += createHelpertext(options.helpertext);
}
if (field.labelAction) {
let action = field.labelAction;
let href = action.href || "";
@@ -1041,6 +1045,17 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
};
}
if (field.helperText) {
labelOptions.helpertext = {
id: `${this.form.name}_${fld}_sub_text`,
ngShow: field.helperText.ngShow,
ngModel: field.helperText.variable,
ngClass: field.helperText.ngClass,
classCondition: field.helperText.classCondition,
text: field.helperText.text
};
}
html += label(labelOptions);
html += "<div ";
@@ -2021,5 +2036,17 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
${options.text}
</label> `;
}
function createHelpertext (options) {
let ngModel = options.ngModel ? `ng-model="${options.ngModel}"` : '';
let ngShow = options.ngShow ? `ng-show="${options.ngShow}"` : '';
let ngClass = options.ngClass ? options.ngClass : '';
let classCondition = options.classCondition ? options.classCondition : '';
return `
<label class="at-InputLabel--helpertext" ng-class="!${classCondition} ? '${ngClass}' : ''" ${ngShow} id="${options.id}" ${ngModel}>
${options.text}
</label> `;
}
}
]);