How to set default first value of valuesProvider for picker in onPropertyCommitted object of form


#1

n radDataForm nativescript + angular
I am using a picker, the first item in valuesProvider is auto select by default by the picker . But this value is not added in the Object of its field (#contactFormData)
and it shows empty when I log the object in onloaded() function.


<RadDataForm [source]="contact"  (loaded)="onLoaded(contactFormData)"  #contactFormData commitMode="Immediate" (propertyCommitted)="onPropertyCommitted(contactFormData)">
<TKEntityProperty tkDataFormProperty name="pipeline" displayName="Pipeline " index="0" [valuesProvider]="pipeLineData">
<TKPropertyEditor tkEntityPropertyEditor type="Picker"></TKPropertyEditor>
</TKEntityProperty>
</RadDataForm>

the typescript for this code is

 public onPropertyCommitted(formDataName) {
        this.updateLabel(formDataName);
    }

    public updateLabel(formDataName) {
        if (formDataName.dataForm.editedObject) {
            this._text = null;
            this._text = this.formatString(formDataName.dataForm.editedObject);
        }
        console.log("------------------");
        console.log( this._text);
        console.log("------------------");
    }

    public formatString(originalString: string) {
        var formattedString: string = originalString.substring(1, originalString.length - 1);
        formattedString = formattedString.replace(/,/g, '\n');
        return formattedString;
    }

#2

valuesProvider just populates the list but it doesn’t set the bound value from the source object.
the 2 options are to add a blank option at the beginning of the providers list and wait for the user to make a selection after the initial load. or to set the value in the source object.


#3

ya i set the value in source object but this object is not added in edited object and if i cannot change the form
new edited object does not have any data which i added form the source


#4

i want to add source object into edited object


#5

More over i test it again and i see that for the Text label i works fine
If the source is fir set by some value it also available in the edited data form

Issue is with the picker because it shows the first value as a hint and not added in the edited object .


#6

How many fields do you have in your values provider list. Do you have just a list of values or do you store a key in the backend while showing the label in the list and selection?


#7

Hi @bear I have similar issue, I have my valuesProvider defined as key value, and my source has key value assigned, but picker doesn’t preselect the label automatically, this looks like some kind of bug with dataform. Do you have example of how do you preselect picker value where your source has value?

this happens only in ios, android is fine

thanks


#8

hey @davorpeic. there is a couple of bugs with the dataform. the biggest one is that if you load values provider list dynamically the editor event handling code actually wipes out the value of the data source variable. so you need to make sure that your the values provider lists are loaded before your data source object. and both are loaded before you render the form. then it should work without issues. i personally haven’t seen the problem you describe. the pickers did show the proper value selected. but going the other way is a problem as well. you have to use form’s onValidate and onValidated events to to confirm proper selection and then translate the selected label to its corresponding key so you can save it to the db.
i ended up writing a separate translation function to convert these values back and forth.

another issue i found was that the onCommit and onCommitted events did not get proper valueCandidate parameter from the editor so there’s no way to do a proper roll-back if the db save failed. so i ended up having 2 versions of the source object in order to be able to roll back in that case.

overall it sure seems that the values provider functionality is rather buggy currently.


#9

Wow, this tips are awesome, and we found our issue, we were pulling source object from local db and calling this method was performed in ngOnInit, we moved the call to service to constructor, and that fixed the issue. I opened github issue and will link it to this so they can try to fix the bug sooner :slight_smile:
thanks again!


#10

glad you got it sorted.