Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to use custom json response #101

Open
kalismeras61 opened this issue Jul 4, 2021 · 1 comment
Open

How to use custom json response #101

kalismeras61 opened this issue Jul 4, 2021 · 1 comment

Comments

@kalismeras61
Copy link
Contributor

Hello @OndrejKunc , i hope you are doing well :) As the contributor this project, I'm here again with a new project :) There has been a lot of change since the last time, can we create a form with a custom json response now?

For example i have below example response from server. Each field means form element, and i will generate form according to DataType ( string, date, etc) . Can you give me some example ? according to below response . ( By the way we can't change json response)

{
"Id": 54,
"Name": "A Testi",
"NamingPattern": "",
"Fields": [
{
"Id": 202,
"Name": "Malzeme Kodu",
"DataType": "string",
"Description": "",
"Regex": "",
"DefaultValue": "",
"Required": false,
"MultiValued": false,
"Unique": false,
"Order": 0,
"LookupId": 0
},
{
"Id": 204,
"Name": "Cari Listesi",
"DataType": "lookup",
"Description": "",
"Regex": "",
"DefaultValue": "",
"Required": false,
"MultiValued": false,
"Unique": false,
"Order": 0,
"LookupId": 6
},
{
"Id": 205,
"Name": "Cast",
"DataType": "string",
"Description": "",
"Regex": "",
"DefaultValue": "",
"Required": false,
"MultiValued": false,
"Unique": false,
"Order": 0,
"LookupId": 0
},
{
"Id": 206,
"Name": "Kullanıldığı Mamul Kodu",
"DataType": "string",
"Description": "",
"Regex": "",
"DefaultValue": "",
"Required": false,
"MultiValued": false,
"Unique": false,
"Order": 0,
"LookupId": 0
}
]
}

@OndrejKunc
Copy link
Owner

Hi @kalismeras61,

Hope you are also doing well. I think fundamentals are still the same, there is now the null safety feature and there are couple of new widgets which should make it easier to set up this project, but they are built on top of existing infrastructure.

I think the situation where you have JSON which can't be changed and should be mapped to some components is not a typical use case for this project. Usually, you define components first, (preferably using YAML) format and use predefined deserialization from JSON or XML.

However, it is possible to write your custom deserialization logic. The whole JSON deserialization is defined in just those 2 classes:
https://github.com/OndrejKunc/flutter_dynamic_forms/tree/master/packages/dynamic_forms/lib/src/parser/json
So you can write your own version of ParserNode and ParserService and then this ParserService can be passed to ParsedFormProvider as shown in the main Readme.md.

But looking at your JSON I am missing one important thing - name of the component. In order to map part of the JSON into a specific component, there needs to be some information for the parser so it knows which component to create. Currently, class JsonParserNode contains the getName method which maps to JSON property with the key "@name". But your JSON seems like you have one parent component with list of children, which doesn't look very dynamic to me.

So maybe you don't need this deserialization mechanism at all, you can just simply deserialize it yourself and create your components directly in your own CustomFormManager:

class CustomFormManager extends FormManager {
  void init({
    required Map<String, dynamic> json,
    List<FunctionExpressionFactory> expressionFactories = const [],
  }) {
    var formBuilder = FormBuilder(
      JsonFormParserService([]), // this is not used, since you don't parse the from in a standard way
      expressionFactories: expressionFactories,
    );

    // Here is your deserialization logic
   // ....
   // CheckBox example to showcase how to create component by hand
    var checkBox = CheckBox();
    checkBox.labelProperty = ImmutableProperty<String>(json['label']);
    checkBox.valueProperty = MutableProperty<bool>(json['value']);

    // assuming rootComponent is the root formElement of your form
    var formData = formBuilder.buildFromForm(rootComponent);
    fillFromFormData(formData);
  }
}

And then use FormProvider instead of ParsedFormProvider in your widget tree (as shown in the Readme.md).

I know it isn't exactly a straightforward solution, but I hope it will help.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants