Updated docs
with array field
Change-Id: Ie707c58a0c38afe30fed776f0d1c16fb777b7457
diff --git a/src/services/helpers/ui/form.helpers.js b/src/services/helpers/ui/form.helpers.js
index 331cdb0..5dbecd7 100644
--- a/src/services/helpers/ui/form.helpers.js
+++ b/src/services/helpers/ui/form.helpers.js
@@ -94,7 +94,6 @@
**/
this.buildFormStructure = (modelField, customField, model, order) => {
-
const orderedForm = {};
modelField = angular.extend(modelField, customField);
diff --git a/src/ui_components/dumbComponents/field/field.component.js b/src/ui_components/dumbComponents/field/field.component.js
index 6fc07ac..6b413bb 100644
--- a/src/ui_components/dumbComponents/field/field.component.js
+++ b/src/ui_components/dumbComponents/field/field.component.js
@@ -85,14 +85,26 @@
this.field5 = {
name: 'select',
- label: 'Select field:',
- type: 'select',
- model: 1,
- options: [
- {id: 1, label: 'One'},
- {id: 2, label: 'Two'},
- {id: 3, label: 'Three'},
- ]
+ field: {
+ label: 'Select field:',
+ type: 'select',
+ options: [
+ {id: 1, label: 'One'},
+ {id: 2, label: 'Two'},
+ {id: 3, label: 'Three'},
+ ]
+ },
+ model: 1
+ };
+
+ this.arrayField = {
+ name: 'array',
+ field: {
+ label: 'Array field:',
+ type: 'array',
+ options: ['one', 'two', 'three', 'four']
+ },
+ model: ['one', 'two'],
};
});
</file>
@@ -103,6 +115,7 @@
<xos-field ng-model="vm.field3.model" name="vm.field3.name" field="vm.field3.field"></xos-field>
<xos-field ng-model="vm.field4.model" name="vm.field4.name" field="vm.field4.field"></xos-field>
<xos-field ng-model="vm.field5.model" name="vm.field5.name" field="vm.field5.field"></xos-field>
+ <xos-field ng-model="vm.arrayField.model" name="vm.arrayField.name" field="vm.arrayField.field"></xos-field>
</div>
</file>
</example>
diff --git a/src/ui_components/dumbComponents/form/form.component.js b/src/ui_components/dumbComponents/form/form.component.js
index ecdddc6..185abc3 100644
--- a/src/ui_components/dumbComponents/form/form.component.js
+++ b/src/ui_components/dumbComponents/form/form.component.js
@@ -22,6 +22,7 @@
* ```
* {
* exclude: ['id', 'validators', 'created', 'updated', 'deleted'], //field to be skipped in the form, the provide values are concatenated
+ * order: ['field1', 'field2'], // ordering the fields (missing ones are attached at the end)
* actions: [ // define the form buttons with related callback
* {
label: 'save',
@@ -56,6 +57,7 @@
* }
* }
* ```
+ * @param {Object} ngModel The model object (it is mandatory to specify at least an empty object)
* @element ANY
* @scope
* @requires xos.uiComponents.directive:xosField
@@ -112,23 +114,21 @@
})
.controller('SampleCtrl1', function(SampleResource){
-
- this.model = {
- };
+ this.model = {};
this.config = {
exclude: ['password', 'last_login'],
formName: 'sampleForm1',
feedback: {
show: false,
- message: 'Form submitted successfully !!!',
+ message: 'Form submitted successfully!',
type: 'success'
},
actions: [
{
label: 'Save',
- icon: 'ok', // refers to bootstraps glyphicon
- cb: (user) => { // receive the model
+ icon: 'ok',
+ cb: (user) => {
console.log(user);
this.config.feedback.show = true;
this.config.feedback.type='success';
@@ -136,6 +136,7 @@
class: 'success'
}
],
+ order: ['site', 'last_name', 'first_name', 'age'],
fields: {
first_name: {
type: 'string',
@@ -158,29 +159,23 @@
min: 21
}
},
-
site: {
- label: 'Site',
- type: 'select',
- validators: { required: true},
- hint: 'The Site this Slice belongs to',
- options: []
+ label: 'Site',
+ type: 'select',
+ validators: { required: true},
+ hint: 'The Site this Slice belongs to',
+ options: []
},
}
};
SampleResource.query().$promise
- .then((users) => {
- //this.users_site = users;
- //console.log(users);
+ .then((users) => {
this.optionVal = users;
this.config.fields['site'].options = this.optionVal;
- //= this.optionVal;
-
- })
- .catch((e) => {
- throw new Error(e);
- });
-
+ })
+ .catch((e) => {
+ throw new Error(e);
+ });
});
</file>
<file name="backend.js">
@@ -193,7 +188,6 @@
.service('SampleResource', function($resource){
return $resource('/test/:id', {id: '@id'});
});
-
</file>
<file name="index.html">
<div ng-controller="SampleCtrl1 as vm">
@@ -264,7 +258,7 @@
}
let diff = _.difference(Object.keys(this.ngModel), this.excludedField);
let modelField = XosFormHelpers.parseModelField(diff);
- this.formField = XosFormHelpers.buildFormStructure(modelField, this.config.fields, this.ngModel);
+ this.formField = XosFormHelpers.buildFormStructure(modelField, this.config.fields, this.ngModel, this.config.order);
}, true);
$scope.$watch(() => this.ngModel, (model) => {