validation type combobox in field

This commit is contained in:
annampak 2018-01-04 13:20:50 +02:00
parent 1d93d2d37e
commit 75614b1229
4 changed files with 60 additions and 43 deletions

View File

@ -1,3 +1,4 @@
export enum ValidationTypes { export enum ValidationTypes {
required None = 0,
} Required = 1
}

View File

@ -78,9 +78,14 @@
</div> </div>
<div class="form-group col-md-5"> <div class="form-group col-md-5">
<label>Validation</label> <label>Validation</label>
<select class="form-control" formControlName="validations"> <div formArrayName="validations">
<option value="required">Required Field</option> <div *ngFor="let validation of form.controls.validations.controls; let i=index">
</select> <select class="form-control" [formControlName]="i">
<option *ngFor= "let option of validationsOptions" [value]="option.key">{{option.value}}</option>
</select>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -2,6 +2,7 @@
import { Rule } from '../../models/DataSetProfile/Rule'; import { Rule } from '../../models/DataSetProfile/Rule';
import { Component, Input } from '@angular/core'; import { Component, Input } from '@angular/core';
import { FormGroup, FormControl, FormArray } from '@angular/forms'; import { FormGroup, FormControl, FormArray } from '@angular/forms';
import { ValidationTypes } from 'app/common/validationTypes';
@Component({ @Component({
selector: 'field-form', selector: 'field-form',
@ -14,15 +15,17 @@ export class FieldFormComponent {
@Input() dataModel: Field; @Input() dataModel: Field;
@Input() showMultiplicity: boolean = true; @Input() showMultiplicity: boolean = true;
@Input() indexPath: string; @Input() indexPath: string;
validationsOptions: Array<any>;
isFieldMultiplicityEnabled: boolean = false; isFieldMultiplicityEnabled: boolean = false;
constructon() { } constructon() {
}
ngOnInit() { ngOnInit() {
if(this.form.get("multiplicity")) if (this.form.get("multiplicity"))
if (this.form.get("multiplicity").value.min >1 || this.form.get("multiplicity").value.max >1) if (this.form.get("multiplicity").value.min > 1 || this.form.get("multiplicity").value.max > 1)
this.isFieldMultiplicityEnabled = true; this.isFieldMultiplicityEnabled = true;
this.validationsOptions = [{ key: 0, value: ValidationTypes[0] }, { key: 1, value: ValidationTypes[1] }]
// this.addNewRule(); // this.addNewRule();
} }
@ -43,4 +46,8 @@ export class FieldFormComponent {
this.dataModel.visible.rules.splice(index, 1); this.dataModel.visible.rules.splice(index, 1);
(<FormArray>this.form.get("visible").get("rules")).removeAt(index); (<FormArray>this.form.get("visible").get("rules")).removeAt(index);
} }
onchangeCombo() {
debugger;
}
} }

View File

@ -7,70 +7,74 @@ import { WordListData } from '../DataField/WordListData';
import { AutocompleteData } from '../DataField/AutocompleteData'; import { AutocompleteData } from '../DataField/AutocompleteData';
import { DataField } from '../DataField/DataField'; import { DataField } from '../DataField/DataField';
import { BaseModel } from '../BaseModel'; import { BaseModel } from '../BaseModel';
import { FormGroup } from '@angular/forms'; import { FormGroup, FormArray, FormControl } from '@angular/forms';
import { FormGenerator } from '../interfaces/FormGenerator'; import { FormGenerator } from '../interfaces/FormGenerator';
import { JsonSerializer } from 'app/utilities/JsonSerializer'; import { JsonSerializer } from 'app/utilities/JsonSerializer';
import { Serializable } from '../interfaces/Serializable'; import { Serializable } from '../interfaces/Serializable';
import {Rule} from './Rule'; import { Rule } from './Rule';
import {Multiplicity} from './Multiplicity'; import { Multiplicity } from './Multiplicity';
import {DefaultValue} from './DefaultValue'; import { DefaultValue } from './DefaultValue';
import {ViewStyle} from './ViewStyle'; import { ViewStyle } from './ViewStyle';
import {Visibility} from './Visibility'; import { Visibility } from './Visibility';
import { ValidationTypes } from 'app/common/validationTypes'; import { ValidationTypes } from 'app/common/validationTypes';
export class Field extends BaseModel implements Serializable<Field>,FormGenerator<FormGroup>{ export class Field extends BaseModel implements Serializable<Field>, FormGenerator<FormGroup>{
public id:string; public id: string;
public title:string; public title: string;
public defaultValue:DefaultValue = new DefaultValue; public defaultValue: DefaultValue = new DefaultValue;
public viewStyle:ViewStyle = new ViewStyle(); public viewStyle: ViewStyle = new ViewStyle();
public page:number; public page: number;
//public multiplicity: Multiplicity = new Multiplicity(); //public multiplicity: Multiplicity = new Multiplicity();
public ordinal: number; public ordinal: number;
public visible: Visibility = new Visibility(); public visible: Visibility = new Visibility();
public data:DataField<any>; public data: DataField<any>;
public validations: Array<ValidationTypes>; public validations: Array<ValidationTypes>;
fromJSONObject(item:any):Field{ fromJSONObject(item: any): Field {
this.id = item.id; this.id = item.id;
this.title = item.title; this.title = item.title;
this.defaultValue = new JsonSerializer<DefaultValue>().fromJSONObject(item.defaultValue, DefaultValue); this.defaultValue = new JsonSerializer<DefaultValue>().fromJSONObject(item.defaultValue, DefaultValue);
this.page = item.page; this.page = item.page;
// this.multiplicity = new JsonSerializer<Multiplicity>().fromJSONObject(item.multiplicity, Multiplicity); // this.multiplicity = new JsonSerializer<Multiplicity>().fromJSONObject(item.multiplicity, Multiplicity);
this.ordinal = item.ordinal; this.ordinal = item.ordinal;
this.validations = item.validations; this.validations = item.validations;
this.viewStyle = new JsonSerializer<ViewStyle>().fromJSONObject(item.viewStyle, ViewStyle); this.viewStyle = new JsonSerializer<ViewStyle>().fromJSONObject(item.viewStyle, ViewStyle);
this.visible = new JsonSerializer<Visibility>().fromJSONObject(item.visible, Visibility); this.visible = new JsonSerializer<Visibility>().fromJSONObject(item.visible, Visibility);
if(item.data) { if (item.data) {
if(this.viewStyle.renderStyle === "combobox"){ if (this.viewStyle.renderStyle === "combobox") {
if(item.data.type === "autocomplete") this.data = new JsonSerializer<AutocompleteData>().fromJSONObject(item.data,AutocompleteData); if (item.data.type === "autocomplete") this.data = new JsonSerializer<AutocompleteData>().fromJSONObject(item.data, AutocompleteData);
if(item.data.type === "wordlist")this.data = new JsonSerializer<WordListData>().fromJSONObject(item.data,WordListData); if (item.data.type === "wordlist") this.data = new JsonSerializer<WordListData>().fromJSONObject(item.data, WordListData);
}else{ } else {
if(this.viewStyle.renderStyle === "radiobox") this.data = new JsonSerializer<RadioBoxData>().fromJSONObject(item.data,RadioBoxData); if (this.viewStyle.renderStyle === "radiobox") this.data = new JsonSerializer<RadioBoxData>().fromJSONObject(item.data, RadioBoxData);
if(this.viewStyle.renderStyle === "checkBox") this.data = new JsonSerializer<CheckBoxData>().fromJSONObject(item.data,CheckBoxData); if (this.viewStyle.renderStyle === "checkBox") this.data = new JsonSerializer<CheckBoxData>().fromJSONObject(item.data, CheckBoxData);
if(this.viewStyle.renderStyle === "textarea") this.data = new JsonSerializer<TextArea>().fromJSONObject(item.data,TextArea); if (this.viewStyle.renderStyle === "textarea") this.data = new JsonSerializer<TextArea>().fromJSONObject(item.data, TextArea);
if(this.viewStyle.renderStyle === "freetext") this.data = new JsonSerializer<FreeTextData>().fromJSONObject(item.data,FreeTextData); if (this.viewStyle.renderStyle === "freetext") this.data = new JsonSerializer<FreeTextData>().fromJSONObject(item.data, FreeTextData);
if(this.viewStyle.renderStyle === "booleanDecision") this.data = new JsonSerializer<BooleanDecisionData>().fromJSONObject(item.data,BooleanDecisionData); if (this.viewStyle.renderStyle === "booleanDecision") this.data = new JsonSerializer<BooleanDecisionData>().fromJSONObject(item.data, BooleanDecisionData);
} }
} }
return this; return this;
} }
buildForm():FormGroup{ buildForm(): FormGroup {
let formGroup = this.formBuilder.group({ let formGroup = this.formBuilder.group({
id: [this.id], id: [this.id],
title: [this.title], title: [this.title],
page:[this.page] , page: [this.page],
ordinal:[this.ordinal], ordinal: [this.ordinal]
validations:[this.validations]
}); });
const arr = new FormArray([
new FormControl(ValidationTypes.None)
]);
//formGroup.addControl("multiplicity", this.multiplicity.buildForm()); //formGroup.addControl("multiplicity", this.multiplicity.buildForm());
formGroup.addControl("validations", arr);
formGroup.addControl("defaultValue", this.defaultValue.buildForm()); formGroup.addControl("defaultValue", this.defaultValue.buildForm());
formGroup.addControl("viewStyle", this.viewStyle.buildForm()); formGroup.addControl("viewStyle", this.viewStyle.buildForm());
formGroup.addControl("visible", this.visible.buildForm()); formGroup.addControl("visible", this.visible.buildForm());
//formGroup.addControl("data",this.data? this.data.buildForm():this.formBuilder.group({})); //formGroup.addControl("data",this.data? this.data.buildForm():this.formBuilder.group({}));
if(this.data)formGroup.addControl("data",this.data.buildForm()); if (this.data) formGroup.addControl("data", this.data.buildForm());
return formGroup; return formGroup;
} }