Kagimura
Kagimura

Reputation: 417

Passing data from one widget to another

I have a list of choice widget and want to pass the selected choice to another widget. Here is the list of choice widget

class ChoiceChipWidget extends StatefulWidget {
  final List<String> reportList;
  final Function(String item) onChoiceSelected;

  ChoiceChipWidget(this.reportList, this.onChoiceSelected);

  @override
  _ChoiceChipWidgetState createState() => new _ChoiceChipWidgetState();
}

class _ChoiceChipWidgetState extends State<ChoiceChipWidget> {
  String selectedChoice = "";

  _buildChoiceList() {
    List<Widget> choices = List();
    widget.reportList.forEach((item) {
      choices.add(Container(
        child: ChoiceChip(
          label: Text(item),
          selected: selectedChoice == item,
          onSelected: (selected) {
            setState(() {
              selectedChoice = item;
              widget.onChoiceSelected(item);
              print(selectedChoice); //DATA THAT NEEDS TO BE PASSED
            });
          },
        ),
      ));
    });
    return choices;
  }

  @override
  Widget build(BuildContext context) {
    return Wrap(
      children: _buildChoiceList(),
    );
  }
}

I need to pass it to this widget

class AddCashPage extends StatefulWidget {
  @override
  _AddCashPageState createState() => _AddCashPageState();
}

class _AddCashPageState extends State<AddCashPage> {

  void createTodo() async {
    if (_formKey.currentState.validate()) {
      _formKey.currentState.save();
      String repetition = //DATA NEEDS TO GO HERE;
      final addCash = AddCash(repetition);
      setState(() {
        id = addCash.id;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Form(
        key: _formKey,
        child: Column(
          children: <Widget>[
            Row(
              children: <Widget>[
                ChoiceChipWidget(chipList, (item) {
                  selectedItem = item;
                }),
              ],
            ),
            RaisedButton(
              child: Text("Update Cash Flow"),
              onPressed: createTodo,
            ),
          ],
        ),
      ),
    );
  }
}

I tried making a constructor inside AddCashPage like this

class AddCashPage extends StatefulWidget {
  final ChoiceChipWidget choiceChipWidget;

  AddCashPage({Key key, @required this.choiceChipWidget}) : super(key: key);

  @override
  _AddCashPageState createState() => _AddCashPageState();
}

Upvotes: 0

Views: 268

Answers (3)

Jay Mungara
Jay Mungara

Reputation: 7150

To use your passed data inside _AddCashPageState class you can use widget property of the corresponding state of the related Stateful class.

For Ex : To use choice chip widget in your class you can use it like widget.ChoiceChipWidget

Any properties/methods provided in AddCashPage class can be accessed in its State class _AddCashPageState() using widget.ChoiceChipWidget property;

You can use this widget property inside methods only like, initState(), build(), dispose() etc.

Upvotes: 2

Pablo Barrera
Pablo Barrera

Reputation: 10953

I think you just missed to call setState() in here:

  ChoiceChipWidget(chipList, (item) {
          selectedItem = item;
        }),

Like this:

  ChoiceChipWidget(chipList, (item) {
          setState(() => selectedItem = item);
        }),

Then you could do this:

AddCash(selectedItem)

Make sure to declare the selectedItem variable inside _AddCashPageState, I don't see it on your code.

Upvotes: 4

Gabriel S
Gabriel S

Reputation: 401

Your choice widget passes the data to the AddCashPage via the constructor you created, but you're missing something. You need to pass the data that AddCashPage has to its state (_AddCashState) so that you can use it there. Basically, you need to create one more constructor.

class AddCashPage extends StatefulWidget {
  final ChoiceChipWidget choiceChipWidget;

  AddCashPage({Key key, @required this.choiceChipWidget}) : super(key: key);

  @override
  _AddCashPageState createState() => _AddCashPageState(choiceChipWidget: choiceChipWidget);
}

And in _AddCashPageState:

class _AddCashPageState extends State<AddCashPage> {
   final choiceChipWidget;
   _AddCashPageState({Key key, @required this.choiceChipWidget});
} 

Upvotes: 2

Related Questions