How to get and display value from a TextEditingController using flutter getx-CodePudding

I'm learning flutter getx -mvc pattern.For a longtime I'm struggling to retrieve a value from text box using Homecontroller and want to display the value when the button is clicked. Here is the code , I have written.My overall task is to add two numbers getting from input box and display .But right now I'm struggling to display the numbers getting from my input box.

I have following code in my Homecontroller.


    import 'package:get/get.dart';
    import 'package:getxmvc/Allpackages.dart';
    
    class Homecontroller extends GetxController {
      var status = "online".obs;
      var followers = 0.obs;
      RxString textVal = "a".obs;
        final editingController = TextEditingController().obs;
      void updateString() {
         textVal.value = editingController.value.text;
      
      } 
    }
I have following code in my main.dart

import 'Allpackages.dart';
import 'src/ProjectSample/Login/Controller/Homecontroller.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final Homecontroller homeCtrl = Get.put(Homecontroller());
 
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("MVC Controller"),
        ),
        body: Center(
          // child: Addingpage(),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              const SizedBox(
                width: 300.0,
                height: 50.0,
                child: TextField(
                  decoration: InputDecoration(
                    hintText: "Enter first no",
                    border: InputBorder.none,
                    focusedBorder: InputBorder.none,
                  ),
                  style: TextStyle(
                      fontSize: 25.0, height: 2.0, color: Colors.black),
                ),
              ),
             
              OutlinedButton(
                  onPressed: () {
                    homeCtrl.updateString();
                  },
                  child: Text('add')),
                Obx(
                () => Text(
                 
                  '${homeCtrl.textVal.value}'.toString(),
                  style: Theme.of(context).textTheme.headline4,
                ),
              ),
                 
            ],
          ),
        ),
      ),
    );
  }
}

When I click the button nothing is displayed.Can anyone let me know what is happening.

CodePudding user response：

  onChanged: (value) {
              homeCtrl.textVal.value = value.toString();
            },

Add this code in your textfield and everything else if fine.

CodePudding user response：

add controller on your TextField :

TextField(controller: homeCtrl.editingController)

it will auto update your TextEditingController.value when value change.