Toc improvements, validator required

This commit is contained in:
annampak 2017-09-29 19:16:37 +03:00
parent 266c5c0767
commit 2f5b10b449
9 changed files with 63 additions and 65 deletions

View File

@ -4,4 +4,15 @@
.show {
display:block;
}
}
.ng-valid[required], .ng-valid.required {
border-left: 5px solid #42A948; /* green */
}
.ng-invalid:not(form) {
border-left: 5px solid #a94442; /* red */
}
.errorMessage{
color:red;
}

View File

@ -20,37 +20,20 @@ import { GroupBase } from './dynamic-form-group/group-base';
export class DynamicFormComponent implements OnInit {
@Input() dataModel: DataModel = new DataModel();
form: FormGroup;
payLoad = '';
form: FormGroup;
payLoad = '';
constructor(private qcs: FieldControlService, private serverService: ServerService, private dataModelService: dataModelBuilder, private router: Router, private route: ActivatedRoute) {
this.form = this.qcs.toFormGroup(new Array(), new Array());
}
getSubForm(subformName){
return this.form.controls[subformName];
}
getSubForm(subformName){
return this.form.controls[subformName];
}
ngOnInit() {
/*
//this.form = this.qcs.toFormGroup(this.fields);
this.serverService.getHTTPFields()
.subscribe(
(data: any[]) => {
this.fields = this.fieldVisibility.getFieldVisibility(data);
this.form = this.qcs.toFormGroup(this.fields);
console.log(this.fields);
},
(error) => console.log(error)
);
//this.buildForm();
*/
console.log("DynamicFormComponent.ngOnInit() -- RUNNIGN");
@ -75,29 +58,6 @@ export class DynamicFormComponent implements OnInit {
},
(error) => console.log(error)
);
/*
this.serverService.getFields()
.subscribe(
(data: any[]) => {
console.log("this.serverService.getFields");
this.dataModel = new DataModel();
this.dataModel = this.fieldVisibility.getDataModel(data);
this.form = this.qcs.toFormGroupAlt(this.dataModel.fields, this.dataModel.groups);
//this.form = this.qcs.toFormGroup(this.fields);
console.log("SUMMARY: ======>");
console.log(this.dataModel);
console.log(this.form);
},
(error) => console.log(error)
);
*/
}

View File

@ -52,9 +52,12 @@
</div>
</ng-container>
</div>
</div>
<div class= "errorMessage" *ngIf="!isValid">{{field.label}} is required</div>
</div>
<!-- <div [formGroup]="form" class="form-group" [ngSwitch]="field.controlType">

View File

@ -17,8 +17,8 @@ export class DynamicFormFieldComponent {
@Input() field: FieldBase<any>;
@Input() form: FormGroup;
get isValid() {
return true; //return this.form.controls[this.field.key].valid;
get isValid() { debugger;
return this.form.controls[this.field.key].valid;
}
public ngOnInit() { //dropdown lists take only one of the available sources

View File

@ -1,7 +1,10 @@
<nav id="toc" data-toggle="toc">
<ul class="nav flex-column">
<li class="nav-item" >
<a class="nav-link" *ngFor ="let header of headers" href="#">{{header}}</a>
</li>
</ul>
</nav>
<body data-spy="scroll" data-target="#toc">
<nav id="toc" data-toggle="toc">
<ul class="nav flex-column">
<li class="nav-item" >
<a class="nav-link" *ngFor ="let group of dataModel.groups" href="#group.key">{{group.title}}</a>
</li>
</ul>
</nav>
</body>

View File

@ -11,7 +11,7 @@ export class TocComponent implements OnInit{
private headers = new Array();
ngOnInit(){
var len = this.dataModel.groups.length;
var len = this.dataModel.groups.length; // I don't use headers , I use datamodel.groupfields
for (var i=0; i<len; i++){
this.headers.push (this.dataModel.groups[i].title)
}

View File

@ -36,7 +36,7 @@ export class LoginComponent implements OnInit{
console.log('Name: ' + profile.getName());
localStorage.setItem('currentUser', JSON.stringify(googleUser));
//this.router.navigateByUrl('dynamic-form');
this.ngZone.run(() => this.router.navigateByUrl('projects'))
this.ngZone.run(() => this.router.navigateByUrl('projects'));
//this.router.navigate(['/projects']);
}

View File

@ -45,7 +45,6 @@ export class dataModelBuilder {
label: element.title.__cdata,
key:element._id,
value: element.value,
required: true,
order:element._ordinal,
rules: element.visible.rule != undefined ? element.visible.rule: rule,
visible: element._defaultVisibility,
@ -62,7 +61,6 @@ export class dataModelBuilder {
label: element.title.__cdata,
key:element._id,
value: element.value,
required: true,
order:element._ordinal,
rules: element.visible.rule != undefined ? element.visible.rule: rule,
visible: element._defaultVisibility,
@ -78,7 +76,6 @@ export class dataModelBuilder {
label: element.title.__cdata,
key:element._id,
value: true,
required: true,
order:element._ordinal,
rules: element.visible.rule != undefined ? element.visible.rule: rule,
visible: element._defaultVisibility,
@ -95,7 +92,6 @@ export class dataModelBuilder {
label: element.title.__cdata,
key:element._id,
value: true,
required: true,
order:element._ordinal,
rules: element.visible.rule != undefined ? element.visible.rule: rule,
visible: element._defaultVisibility,
@ -219,6 +215,8 @@ export class dataModelBuilder {
newAttribute.ordinal = attr._ordinal;
newAttribute.sources = new Array();
newAttribute.sources.push(attr.sources.source);
newAttribute.validation = new Array();
//newAttribute.validation.push(attr.validation.rule);
newAttribute.sources.forEach(src => {
src.params=new Array();
@ -230,11 +228,28 @@ export class dataModelBuilder {
}
});
newAttribute.validation = attr.validation;
if (attr.validation.rule.length)
for (var i=0, len=attr.validation.rule.length; i<len; i++){
let rule = new Rule();
rule.ruleStyle= attr.validation.rule[i]._ruleStyle;
rule.ruleType= attr.validation.rule[i]._type;
newAttribute.validation.push(rule);
}
else{
if(attr.validation.rule){
let rule = new Rule();
rule.ruleStyle= attr.validation.rule._ruleStyle;
rule.ruleType= attr.validation.rule._type;
newAttribute.validation.push(rule);
}
}
console.log(newAttribute);
attribute.push(newAttribute);
fields.find(x => x.key == newAttribute.id).attributes.sources = newAttribute.sources;
fields.find(x => x.key == newAttribute.id).attributes.validation = newAttribute.validation;
});

View File

@ -16,6 +16,12 @@ export class FieldControlService {
groups.forEach(group => {
let subgroup: any = {};
group.groupFields.forEach(field => {
if(field.attributes.validation != undefined)
field.attributes.validation.forEach(val => {
if (val.ruleStyle.toString()=="existence"){
field.required = true;
}
});
subgroup[field.key] = field.required ? new FormControl(field.value || '', Validators.required) : new FormControl(field.value || '')
});
//PLEASE CHANGE THE group.key TO BE SAME AS THE ONE ON THE DYNAMIC-FORM-GROUP-COMPONENT.html