Question 79566 in Flutter Question posted in
The official Flutter documentation can be found here.

Flutter: Not able to select items in Radio button, in ListTile

Im a newbie, Not able to select items in Radio button, inside a ListTile. I tied to use same code without ListTile and working as expected. Looks like combination is not correct or i might be missing something.

class _TempState extends State<Temp> {
  int selectedValue = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: SafeArea(
            child: Container(
                child: Column(children: [
          Row(
            children: [
              Expanded(
                  child: Text("Radio button with ListView",))],),
          Expanded(
            child: ListView.builder(
                itemCount: 1,
                itemBuilder: (BuildContext context, int index) {
                  return OrderItem();
                }),),
        ]))));}

  Widget OrderItem() {
    int selectedValue = 0;
    return ListTile(
        title: Container(
            child: Column(children: [
      Row(
        children: [
          Expanded(
              child: Text(
            "Product Type :",
          )),
          Radio<int>(
            value: 1,
            groupValue: selectedValue,
            onChanged: (value) {
              setState(() {
                selectedValue = value != null ? value.toInt() : 1;
              });
            },
          ),
          Text('NRML'),
          Radio<int>(
              value: 2,
              groupValue: selectedValue,
              onChanged: (value) {
                setState(() {
                  selectedValue = value != null ? value.toInt() : 1;
                });
              }),
          Text('MARKET'),
        ],), ])));
  }}

enter image description here

Tags:

3

Answers


  1. 0

    In your second radio you should change your setState to

    selectedValue = value != null ? value.toInt() : 2;

    Value you assign to radio will be used to determine which radio is selected. So if you want to select second radio you should assign its value when selecting

    Login or Signup to reply.
  2. 0

    You are updating your selectedValue in wrong way ,first define your selectedValue like this:

    int? selectedValue;

    then update your widget like this:

    Widget OrderItem() {//remove int selectedValue = 0; here
    return ListTile(
      title: Container(
        child: Column(
          children: [
            Row(
              children: [
                Expanded(
                    child: Text(
                  "Product Type :",
                )),
                Radio<int>(
                  value: 1,
                  groupValue: selectedValue,
                  onChanged: (value) {
                    setState(() {
                      selectedValue = value; //<-- change this
                    });
                  },
                ),
                Text('NRML'),
                Radio<int>(
                    value: 2,
                    groupValue: selectedValue,
                    onChanged: (value) {
                      setState(() {
                        selectedValue = value; //<-- change this
                      });
                    }),
                Text('MARKET'),
              ],
            ),
          ],
        ),
      ),
    );
  }

    Also another reason that is not working is that you are define another int selectedValue = 0; in your OrderItem method, you need to remove it.

    enter image description here

    Login or Signup to reply.
  3. 0 
    selectedValue = value != null ? value.toInt() : 2;

    Value you assign to radio will be used to determine which radio is selected. So if you want to select second radio you should assign its value when selecting

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search