M Al
M Al

Reputation: 461

How we can control function from other page in flutter

I make small app this app have two pages. First page main page then second page. now in each pages I add function this function to can add new data in MySQL database. Now my problem the user is work in main page and when click button add in main page I need to make the method on the other page work as well in same time.

So how we can control function from other page? How I can call AddNewColor() in MainPage in button (add new data).

Note: This is just an example of what I am trying to do also to understand the idea and the problem. In my full application, I display the second page on the first page to display a set of images.

Main page code:


void main() {
  runApp(MainPage());
}
class MainPage extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MainPage> {
  TextEditingController NameController = TextEditingController();
  Future AddNewData() async {
    final response = await http.post(Uri.parse("**********", ),
        body: {
          "Name": NameController.text,
        }
    );
    if (response.statusCode == 200) {
    } else {
      throw Exception('Send Failed');
    }
  }


  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          body: Column(children: [
            TextFormField(
              controller: NameController,
              decoration: InputDecoration(
                  border: OutlineInputBorder(),
        
                 ),

            ),

            ElevatedButton(
              child: Text('add new data'),
              onPressed: () {
                AddNewData();
              },
            ),
          ],)
      ),
    );
  }
}

Second Page code:


class secondpage extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<secondpage> {

  TextEditingController ColorController = TextEditingController();
  Future AddNewColor() async {
    final response = await http.post(Uri.parse("**********", ),
        body: {
          "Color": ColorController.text,
        }
    );
    if (response.statusCode == 200) {
    } else {
      throw Exception('Send Failed');
    }
  }


  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Column(children: [
          TextFormField(
            controller: ColorController,
            decoration: InputDecoration(
                border: OutlineInputBorder(),
             ),

          ),

          ElevatedButton(
            child: Text('add new color'),
            onPressed: () {
              AddNewColor();
            },
          ),
        ],)
      ),
    );
  }
}

Upvotes: 0

Views: 435

Answers (1)

eamirho3ein
eamirho3ein

Reputation: 17890

Define AddNewColor() out of secondpage class:

Future AddNewColor(TextEditingController colorController) async {
    final response = await http.post(Uri.parse("**********", ),
        body: {
          "Color": ColorController.text,
        }
    );
    if (response.statusCode == 200) {
    } else {
      throw Exception('Send Failed');
    }
  }

class secondpage extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<secondpage> {
  ...
}

now you can call it every where you want. Note that use return way to pass the result data.

update: try define ColorController here:

class _MyAppState extends State<MainPage> {
  TextEditingController NameController = TextEditingController();
  TextEditingController ColorController = TextEditingController();
  Future AddNewData() async {
  ...
  }
...
}

then change your second page to receive it like this:

class secondpage extends StatefulWidget {
  final TextEditingController ColorController;
  secondpage(this.ColorController);

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

now you can use ColorController in both pages with AddNewColor.

Upvotes: 1

Related Questions