Home > Blockchain >  How to create and use radio field options from a database query using Flutter Form Builder
How to create and use radio field options from a database query using Flutter Form Builder

Time:03-13

I am using flutter_form_builder in my project and want to create and load the formbuilderfieldoptions when I load the form. My strategy would be to query the database and create the options on the button pressed method of a floating button in the previous page. What would be the best way of passing the options into the form and using them in a radio group.

I have this code using a static radio group but can't figure out how to load them using a predefined widget. Could I create them in the button press event in the previous page and load them using a provider?

FormBuilderRadioGroup(
  name: "various_options",
  decoration: InputDecoration(
    contentPadding: EdgeInsets.all(12.0),
    labelText: "Select an Option",
    labelStyle: TextStyle(
      fontSize: _user.fontsize, fontWeight: FontWeight.normal)),
    options: const [
      FormBuilderFieldOption(value: 100, child: Text('Option 1')),
      FormBuilderFieldOption(value: 1121, child: Text('Option 2')),
      FormBuilderFieldOption(value: 211, child: Text('Option 3')),
      FormBuilderFieldOption(value: 32, child: Text('Option 4')),
      FormBuilderFieldOption(value: 44, child: Text('Option 5')),
    ],
    orientation: OptionsOrientation.vertical,
    activeColor: Colors.teal,
    initialValue: person.role,
),

CodePudding user response:

Create the form as a separate Stateful page widget. You can then pass in the list of options (List<MyData>) as an argument to the widget, say:

class MyData {
  final int key;
  final String value;
  ...
}

...
final List<MyData> options;
const FormPageWidget({Key? key, required this.options}) : super(key: key);

Then in your FormBuilderRadioGroup constructor:

...
options: List<FormBuilderFieldOption>.generate(
  widget.options.length,
  (index) {
    return FormBuilderFieldOption(
      value: widget.options[index].key,
      child: Text(widget.options[index].value)
    );
  },
  growable: false,
);
...
  • Related