Flutter Online User Registration using PHP MySQL Server Tutorial Android iOS Example

admin October 20, 2019 October 20, 2019Flutter Tutorials

User registration is one of the most usable functionality we have ever seen in mobile applications. In today’s word almost every app comes with user registration form, where user can create his account on online MySQL server or MongoDB server. In current tutorial we are using PhpMyAdmin server with MySQL database. We are using PHP scripting language to receive and insert user registration data into MySQL database. So in this tutorial we would create Flutter Online User Registration using PHP MySQL Server Tutorial iOS Android.

Key feature of this tutorial:

Online user registration using PHP MySQL.
Duplicate email address registration forbidden.
User can only create 1 account with 1 email, If same email found than registration will not be completed unless user enters new email address.

Contents in this project Flutter Online User Registration using PHP MySQL Server Tutorial iOS Android Example:

1. Create MySQL database + Table in PhpMyAdmin Server:

1. We are using MySQL database in our tutorial which can be accessed via PhpMyAdmin control panel. We have a demo online web hosting account with PhpMyAdmin. So open your PhpMyAdmin control panel and you can also select already created database or create a new database. In my case i am using my already created database.

2. After selecting the database we have to create a Table named as user_registration inside it with 4 Columns. See the below screenshot for more details.

3. Create 4 Column name inside the Table named as id, name, email and password. We have to declare the id as integer data type with Primary key with Auto increment here. name, email and password should be in Varchar data type. Now hit the Save button.

4. Below is the user_registration table screenshot after creating successfully.

2. Creating PHP Script to Receive the User Registration Data Coming From Flutter App and Insert into MySQL Database:

1. Create a .php extension file named as register_user.php and paste all the below code in it. You have to change the Database hostname, database password, database username and database name in this file with your database details.

Complete Source Code for register_user.php file :

<?php
 
//Define your Server host name here.
$HostName = "localhost";
 
//Define your MySQL Database Name here.
$DatabaseName = "id11189654_flutter_db";
 
//Define your Database User Name here.
$HostUser = "id11189654_root";
 
//Define your Database Password here.
$HostPass = "1234567890"; 
 
// Creating MySQL Connection.
$con = mysqli_connect($HostName,$HostUser,$HostPass,$DatabaseName);
 
// Storing the received JSON into $json variable.
$json = file_get_contents('php://input');
 
// Decode the received JSON and Store into $obj variable.
$obj = json_decode($json,true);
 
// Getting name from $obj object.
$name = $obj['name'];
 
// Getting Email from $obj object.
$email = $obj['email'];
 
// Getting Password from $obj object.
$password = $obj['password'];

// Checking whether Email is Already Exist or Not in MySQL Table.
$CheckSQL = "SELECT * FROM user_registration WHERE email='$email'";

// Executing Email Check MySQL Query.
$check = mysqli_fetch_array(mysqli_query($con,$CheckSQL));


if(isset($check)){

	 $emailExist = 'Email Already Exist, Please Try Again With New Email Address..!';
	 
	 // Converting the message into JSON format.
	$existEmailJSON = json_encode($emailExist);
	 
	// Echo the message on Screen.
	 echo $existEmailJSON ; 

  }
 else{
 
	 // Creating SQL query and insert the record into MySQL database table.
	 $Sql_Query = "insert into user_registration (name,email,password) values ('$name','$email','$password')";
	 
	 
	 if(mysqli_query($con,$Sql_Query)){
	 
		 // If the record inserted successfully then show the message.
		$MSG = 'User Registered Successfully' ;
		 
		// Converting the message into JSON format.
		$json = json_encode($MSG);
		 
		// Echo the message.
		 echo $json ;
	 
	 }
	 else{
	 
		echo 'Try Again';
	 
	 }
 }
 mysqli_close($con);
?>

<?php

//Define your Server host name here.

$HostName = "localhost";

//Define your MySQL Database Name here.

$DatabaseName = "id11189654_flutter_db";

//Define your Database User Name here.

$HostUser = "id11189654_root";

//Define your Database Password here.

$HostPass = "1234567890";

// Creating MySQL Connection.

$con = mysqli_connect($HostName,$HostUser,$HostPass,$DatabaseName);

// Storing the received JSON into $json variable.

$json = file_get_contents('php://input');

// Decode the received JSON and Store into $obj variable.

$obj = json_decode($json,true);

// Getting name from $obj object.

$name = $obj['name'];

// Getting Email from $obj object.

$email = $obj['email'];

// Getting Password from $obj object.

$password = $obj['password'];

// Checking whether Email is Already Exist or Not in MySQL Table.

$CheckSQL = "SELECT * FROM user_registration WHERE email='$email'";

// Executing Email Check MySQL Query.

$check = mysqli_fetch_array(mysqli_query($con,$CheckSQL));

if(isset($check)){

$emailExist = 'Email Already Exist, Please Try Again With New Email Address..!';

// Converting the message into JSON format.

$existEmailJSON = json_encode($emailExist);

// Echo the message on Screen.

echo $existEmailJSON ;

}

else{

// Creating SQL query and insert the record into MySQL database table.

$Sql_Query = "insert into user_registration (name,email,password) values ('$name','$email','$password')";

if(mysqli_query($con,$Sql_Query)){

// If the record inserted successfully then show the message.

$MSG = 'User Registered Successfully' ;

// Converting the message into JSON format.

$json = json_encode($MSG);

// Echo the message.

echo $json ;

}

else{

echo 'Try Again';

}

mysqli_close($con);

2. We have to upload this .Php file on our online hosting server using File manager our Filezilla ftp client. In our case we have a demo hosting account with connecting with Sub domain name https://flutter-examples.000webhostapp.com/ . After uploading register_user.php file on our server the Complete URL of API is https://flutter-examples.000webhostapp.com/register_user.php . We would use this API URL in our flutter app.

3. Setting up http.dart Package in your Flutter Project:

1. We are using http.dart package in our flutter project to perform the Web call functionality. This package has all the functions and classes used to transfer data between client and server. This package cannot comes with Flutter project, we have to manually configured it in our flutter project. So open your project’s pubspec.yaml file.

2. Open the pubspec.yaml file in Code editor and find dependencies. Put http: ^0.12.0 in next line.

dependencies:
  http: ^0.12.0
  flutter:
    sdk: flutter

dependencies:

http: ^0.12.0

flutter:

sdk: flutter

Complete Source code for pubspec.yaml file:

name: app
description: A new Flutter project.

version: 1.0.0+1

environment:
  sdk: ">=2.1.0 <3.0.0"

dependencies:
  http: ^0.12.0
  flutter:
    sdk: flutter

  cupertino_icons: ^0.1.2

dev_dependencies:
  flutter_test:
    sdk: flutter


flutter:

  uses-material-design: true

name: app

description: A new Flutter project.

version: 1.0.0+1

environment:

sdk: ">=2.1.0 <3.0.0"

dependencies:

http: ^0.12.0

flutter:

sdk: flutter

cupertino_icons: ^0.1.2

dev_dependencies:

flutter_test:

sdk: flutter

flutter:

uses-material-design: true

3. Now open the Flutter project root folder path in Command Prompt and execute flutter pub get command. This command will download all the newly added package from online server.

4. Start Coding for Flutter App:

1. Open your project’s main.dart file and Import material.dart, convert and http.dart package.

import 'package:flutter/material.dart';
import 'dart:convert';
import 'package:http/http.dart' as http;

import 'package:flutter/material.dart';

import 'dart:convert';

import 'package:http/http.dart' as http;

2. Call our main MyApp class using void main runApp() method.

void main() => runApp(MyApp());

1	void main() => runApp(MyApp());

3. Create a new class named as MyApp extends with State less widget. This is our main Root View class. In this class we are calling RegisterUser class.

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
  home: Scaffold(
      appBar: AppBar(title: Text('User Registration Form')),
      body: Center(
        child: RegisterUser()
        )
      )
    );
}
}

class MyApp extends StatelessWidget {

@override

Widget build(BuildContext context) {

return MaterialApp(

home: Scaffold(

appBar: AppBar(title: Text('User Registration Form')),

body: Center(

child: RegisterUser()

)

);

}

4. Create a class named as RegisterUser extends with StatefulWidget. In this class we would pass RegisterUserState class using createState() method. The createState() method would allow us to use Mutable state management in given class root.

class RegisterUser extends StatefulWidget {

RegisterUserState createState() => RegisterUserState();

}

class RegisterUser extends StatefulWidget {

RegisterUserState createState() => RegisterUserState();

}

5. Create our main class named as RegisterUserState extends with State. In this class we would design our complete registration form.

class RegisterUserState extends State {


}

class RegisterUserState extends State {

}

6. Create a Boolean variable named as visible with default value False. We would use this variable with State to show and hide the Circular progress indicator.

  // Boolean variable for CircularProgressIndicator.
  bool visible = false ;

1 2	// Boolean variable for CircularProgressIndicator. bool visible = false ;

7. Create 3 TextEditingController() objects to Get the entered data from all 3 Text Fields widget. To get data from Text Field it is necessary to use text editing controller.

// Getting value from TextField widget.
  final nameController = TextEditingController();
  final emailController = TextEditingController();
  final passwordController = TextEditingController();

// Getting value from TextField widget.

final nameController = TextEditingController();

final emailController = TextEditingController();

final passwordController = TextEditingController();

8. Creating a ASYNC function named as userRegistration(). We would call this function on button onPress event. In this function first we would get entered value from Text Field Text Input widget in String variables then make a Web call to our online server. We would also print the response message on Screen using Alert dialog box. We have to use Future keyword with function. Future keyword is used to make object representing delayed computation.

Future userRegistration() async{

  // Showing CircularProgressIndicator.
  setState(() {
  visible = true ; 
  });

  // Getting value from Controller
  String name = nameController.text;
  String email = emailController.text;
  String password = passwordController.text;

  // SERVER API URL
  var url = 'https://flutter-examples.000webhostapp.com/register_user.php';

  // Store all data with Param Name.
  var data = {'name': name, 'email': email, 'password' : password};

  // Starting Web API Call.
  var response = await http.post(url, body: json.encode(data));

  // Getting Server response into variable.
  var message = jsonDecode(response.body);

  // If Web call Success than Hide the CircularProgressIndicator.
  if(response.statusCode == 200){
  setState(() {
    visible = false; 
  });
}

  // Showing Alert Dialog with Response JSON Message.
  showDialog(
  context: context,
  builder: (BuildContext context) {
    return AlertDialog(
      title: new Text(message),
      actions: <Widget>[
        FlatButton(
          child: new Text("OK"),
          onPressed: () {
            Navigator.of(context).pop();
          },
        ),
      ],
    );
  },
  );

}

Future userRegistration() async{

// Showing CircularProgressIndicator.

setState(() {

visible = true ;

});

// Getting value from Controller

String name = nameController.text;

String email = emailController.text;

String password = passwordController.text;

// SERVER API URL

var url = 'https://flutter-examples.000webhostapp.com/register_user.php';

// Store all data with Param Name.

var data = {'name': name, 'email': email, 'password' : password};

// Starting Web API Call.

var response = await http.post(url, body: json.encode(data));

// Getting Server response into variable.

var message = jsonDecode(response.body);

// If Web call Success than Hide the CircularProgressIndicator.

if(response.statusCode == 200){

setState(() {

visible = false;

});

}

// Showing Alert Dialog with Response JSON Message.

showDialog(

context: context,

builder: (BuildContext context) {

return AlertDialog(

title: new Text(message),

actions: <Widget>[

FlatButton(

child: new Text("OK"),

onPressed: () {

Navigator.of(context).pop();

);

}

9. Creating 3 Text Field widget, 1 Raised button widget and 1 Circular Progress Indicator in Widget build area of RegisterUserState class.

Widget build(BuildContext context) {
return Scaffold(
  body: SingleChildScrollView(
    child: Center(
    child: Column(
      children: <Widget>[

        Padding(
          padding: const EdgeInsets.all(12.0),
          child: Text('User Registration Form', 
                  style: TextStyle(fontSize: 21))),

        Divider(),          

        Container(
        width: 280,
        padding: EdgeInsets.all(10.0),
        child: TextField(
            controller: nameController,
            autocorrect: true,
            decoration: InputDecoration(hintText: 'Enter Your Name Here'),
          )
        ),

        Container(
        width: 280,
        padding: EdgeInsets.all(10.0),
        child: TextField(
            controller: emailController,
            autocorrect: true,
            decoration: InputDecoration(hintText: 'Enter Your Email Here'),
          )
        ),

        Container(
        width: 280,
        padding: EdgeInsets.all(10.0),
        child: TextField(
            controller: passwordController,
            autocorrect: true,
            obscureText: true,
            decoration: InputDecoration(hintText: 'Enter Your Password Here'),
          )
        ),

        RaisedButton(
          onPressed: userRegistration,
          color: Colors.green,
          textColor: Colors.white,
          padding: EdgeInsets.fromLTRB(10, 10, 10, 10),
          child: Text('Click Here To Register User Online'),
        ),

        Visibility(
          visible: visible, 
          child: Container(
            margin: EdgeInsets.only(bottom: 30),
            child: CircularProgressIndicator()
            )
          ),

      ],
    ),
  )));
}

Widget build(BuildContext context) {

return Scaffold(

body: SingleChildScrollView(

child: Center(

child: Column(

children: <Widget>[

Padding(

padding: const EdgeInsets.all(12.0),

child: Text('User Registration Form',

style: TextStyle(fontSize: 21))),

Divider(),

Container(

width: 280,

padding: EdgeInsets.all(10.0),

child: TextField(

controller: nameController,

autocorrect: true,

decoration: InputDecoration(hintText: 'Enter Your Name Here'),

)

Container(

width: 280,

padding: EdgeInsets.all(10.0),

child: TextField(

controller: emailController,

autocorrect: true,

decoration: InputDecoration(hintText: 'Enter Your Email Here'),

)

Container(

width: 280,

padding: EdgeInsets.all(10.0),

child: TextField(

controller: passwordController,

autocorrect: true,

obscureText: true,

decoration: InputDecoration(hintText: 'Enter Your Password Here'),

)

RaisedButton(

onPressed: userRegistration,

color: Colors.green,

textColor: Colors.white,

padding: EdgeInsets.fromLTRB(10, 10, 10, 10),

child: Text('Click Here To Register User Online'),

Visibility(

visible: visible,

child: Container(

margin: EdgeInsets.only(bottom: 30),

child: CircularProgressIndicator()

)

)));

}

10. Complete source code for main.dart file:

import 'package:flutter/material.dart';
import 'dart:convert';
import 'package:http/http.dart' as http;

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
  home: Scaffold(
      appBar: AppBar(title: Text('User Registration Form')),
      body: Center(
        child: RegisterUser()
        )
      )
    );
}
}

class RegisterUser extends StatefulWidget {

RegisterUserState createState() => RegisterUserState();

}

class RegisterUserState extends State {

  // Boolean variable for CircularProgressIndicator.
  bool visible = false ;

  // Getting value from TextField widget.
  final nameController = TextEditingController();
  final emailController = TextEditingController();
  final passwordController = TextEditingController();

Future userRegistration() async{

  // Showing CircularProgressIndicator.
  setState(() {
  visible = true ; 
  });

  // Getting value from Controller
  String name = nameController.text;
  String email = emailController.text;
  String password = passwordController.text;

  // SERVER API URL
  var url = 'https://flutter-examples.000webhostapp.com/register_user.php';

  // Store all data with Param Name.
  var data = {'name': name, 'email': email, 'password' : password};

  // Starting Web API Call.
  var response = await http.post(url, body: json.encode(data));

  // Getting Server response into variable.
  var message = jsonDecode(response.body);

  // If Web call Success than Hide the CircularProgressIndicator.
  if(response.statusCode == 200){
  setState(() {
    visible = false; 
  });
}

  // Showing Alert Dialog with Response JSON Message.
  showDialog(
  context: context,
  builder: (BuildContext context) {
    return AlertDialog(
      title: new Text(message),
      actions: <Widget>[
        FlatButton(
          child: new Text("OK"),
          onPressed: () {
            Navigator.of(context).pop();
          },
        ),
      ],
    );
  },
  );

}

@override
Widget build(BuildContext context) {
return Scaffold(
  body: SingleChildScrollView(
    child: Center(
    child: Column(
      children: <Widget>[

        Padding(
          padding: const EdgeInsets.all(12.0),
          child: Text('User Registration Form', 
                  style: TextStyle(fontSize: 21))),

        Divider(),          

        Container(
        width: 280,
        padding: EdgeInsets.all(10.0),
        child: TextField(
            controller: nameController,
            autocorrect: true,
            decoration: InputDecoration(hintText: 'Enter Your Name Here'),
          )
        ),

        Container(
        width: 280,
        padding: EdgeInsets.all(10.0),
        child: TextField(
            controller: emailController,
            autocorrect: true,
            decoration: InputDecoration(hintText: 'Enter Your Email Here'),
          )
        ),

        Container(
        width: 280,
        padding: EdgeInsets.all(10.0),
        child: TextField(
            controller: passwordController,
            autocorrect: true,
            obscureText: true,
            decoration: InputDecoration(hintText: 'Enter Your Password Here'),
          )
        ),

        RaisedButton(
          onPressed: userRegistration,
          color: Colors.green,
          textColor: Colors.white,
          padding: EdgeInsets.fromLTRB(10, 10, 10, 10),
          child: Text('Click Here To Register User Online'),
        ),

        Visibility(
          visible: visible, 
          child: Container(
            margin: EdgeInsets.only(bottom: 30),
            child: CircularProgressIndicator()
            )
          ),

      ],
    ),
  )));
}
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

import 'package:flutter/material.dart';

import 'dart:convert';

import 'package:http/http.dart' as http;

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {

@override

Widget build(BuildContext context) {

return MaterialApp(

home: Scaffold(

appBar: AppBar(title: Text('User Registration Form')),

body: Center(

child: RegisterUser()

)

);

}

class RegisterUser extends StatefulWidget {

RegisterUserState createState() => RegisterUserState();

}

class RegisterUserState extends State {

// Boolean variable for CircularProgressIndicator.

bool visible = false ;

// Getting value from TextField widget.

final nameController = TextEditingController();

final emailController = TextEditingController();

final passwordController = TextEditingController();

Future userRegistration() async{

// Showing CircularProgressIndicator.

setState(() {

visible = true ;

});

// Getting value from Controller

String name = nameController.text;

String email = emailController.text;

String password = passwordController.text;

// SERVER API URL

var url = 'https://flutter-examples.000webhostapp.com/register_user.php';

// Store all data with Param Name.

var data = {'name': name, 'email': email, 'password' : password};

// Starting Web API Call.

var response = await http.post(url, body: json.encode(data));

// Getting Server response into variable.

var message = jsonDecode(response.body);

// If Web call Success than Hide the CircularProgressIndicator.

if(response.statusCode == 200){

setState(() {

visible = false;

});

}

// Showing Alert Dialog with Response JSON Message.

showDialog(

context: context,

builder: (BuildContext context) {

return AlertDialog(

title: new Text(message),

actions: <Widget>[

FlatButton(

child: new Text("OK"),

onPressed: () {

Navigator.of(context).pop();

);

}

@override

Widget build(BuildContext context) {

return Scaffold(

body: SingleChildScrollView(

child: Center(

child: Column(

children: <Widget>[

Padding(

padding: const EdgeInsets.all(12.0),

child: Text('User Registration Form',

style: TextStyle(fontSize: 21))),

Divider(),

Container(

width: 280,

padding: EdgeInsets.all(10.0),

child: TextField(

controller: nameController,

autocorrect: true,

decoration: InputDecoration(hintText: 'Enter Your Name Here'),

)

Container(

width: 280,

padding: EdgeInsets.all(10.0),

child: TextField(

controller: emailController,

autocorrect: true,

decoration: InputDecoration(hintText: 'Enter Your Email Here'),

)

Container(

width: 280,

padding: EdgeInsets.all(10.0),

child: TextField(

controller: passwordController,

autocorrect: true,

obscureText: true,

decoration: InputDecoration(hintText: 'Enter Your Password Here'),

)

RaisedButton(

onPressed: userRegistration,

color: Colors.green,

textColor: Colors.white,

padding: EdgeInsets.fromLTRB(10, 10, 10, 10),

child: Text('Click Here To Register User Online'),

Visibility(

visible: visible,

child: Container(

margin: EdgeInsets.only(bottom: 30),

child: CircularProgressIndicator()

)

)));

}

Screenshots:

Screenshot of Table after inserting record:

Also Read:

Flutter Dart Check Entered String Value is Number or Not Example

Show Hide Widgets in Flutter Programmatically on Button Click Android iOS Example

Flutter Find Maximum Minimum Number Between Multiple Numbers Dart Example

Create Simple ListView in Flutter using ListTile Android iOS Example

Create Multiple Radio Button Radio Group in Flutter iOS Android

71 Comments

melcah
December 26, 2019 at 6:23 am

i try this but its not working
its just keep loading

Reply
- admin
  December 26, 2019 at 1:27 pm
  
  Melcah did you import the http library and one more thing which server you are using like Local server or online server ?
  
  Reply
  - prosper
    December 30, 2019 at 9:34 am
    
    im using local server and had to make use of the 10.0.2.2(testing with emulator) but not working help please
    
    Reply
    - prosper
      December 30, 2019 at 9:39 am
      
      solved had to downgrade my http lib
      
      Reply
      - admin
        January 3, 2020 at 5:19 am
        
        Thanks for notifying us 🙂 .
      - jigs123
        May 6, 2020 at 1:30 pm
        
        which version of http lib you used? As nothing happens on clicking ‘Click for registration’ button, instead it gives me following in debug console:
        
        I/flutter (23797): ══╡ EXCEPTION CAUGHT BY GESTURE ╞═══════════════════════════════════════
        I/flutter (23797): The following _CompileTimeError was thrown while handling a gesture:
        I/flutter (23797): Unimplemented handling of missing static target
        I/flutter (23797):
        I/flutter (23797): When the exception was thrown, this was the stack:
        I/flutter (23797): #0 _InkResponseState._handleTap (package:flutter/src/material/ink_well.dart:706:14)
        I/flutter (23797): #1 _InkResponseState.build. (package:flutter/src/material/ink_well.dart:789:36)
        I/flutter (23797): #2 GestureRecognizer.invokeCallback (package:flutter/src/gestures/recognizer.dart:182:24)
        I/flutter (23797): #3 TapGestureRecognizer.handleTapUp (package:flutter/src/gestures/tap.dart:486:11)
        I/flutter (23797): #4 BaseTapGestureRecognizer._checkUp (package:flutter/src/gestures/tap.dart:264:5)
        I/flutter (23797): #5 BaseTapGestureRecognizer.acceptGesture (package:flutter/src/gestures/tap.dart:236:7)
        I/flutter (23797): #6 GestureArenaManager.sweep (package:flutter/src/gestures/arena.dart:156:27)
        I/flutter (23797): #7 GestureBinding.handleEvent (package:flutter/src/gestures/binding.dart:222:20)
        I/flutter (23797): #8 GestureBinding.dispatchEvent (package:flutter/src/gestures/binding.dart:198:22)
        I/flutter (23797): #9 GestureBinding._handlePointerEvent (package:flutter/src/gestures/binding.dart:156:7)
        I/flutter (23797): #10 GestureBinding._flushPointerEventQueue (package:flutter/src/gestures/binding.dart:102:7)
        I/flutter (23797): #11 GestureBinding._handlePointerDataPacket (package:flutter/src/gestures/binding.dart:86:7)
        I/flutter (23797): #15 _invoke1 (dart:ui/hooks.dart:273:10)
        I/flutter (23797): #16 _dispatchPointerDataPacket (dart:ui/hooks.dart:182:5)
        I/flutter (23797): (elided 3 frames from package dart:async)
        I/flutter (23797):
        I/flutter (23797): Handler: “onTap”
        I/flutter (23797): Recognizer:
        I/flutter (23797): TapGestureRecognizer#8913a
        I/flutter (23797): ════════════════════════════════════════
        D/GraphicBuffer(23797): register, handle(0xe68cee40) (w:1080 h:1920 s:1088 f:0x1 u:0x000b00)
umair
January 15, 2020 at 7:11 pm

its just keep loading in app but give alot of error statement in android studio and also add data in the database tables too 🙁

Reply
- admin
  January 16, 2020 at 4:42 am
  
  Umar which server you are using like Localhost or online sever ? And also tell me your API URL .
  
  Reply
  - umair
    January 17, 2020 at 5:51 pm
    
    online server… can you please mail me on my email [email protected] so i can share api url and screenshots also…
    
    https://umairqaiser444.000webhostapp.com/registeration.php
    api url
    
    Reply
  - Faham khan
    April 11, 2020 at 3:39 pm
    
    I’m facing same issue. It shows loading symbol and i’m using localhost
    My API URL is https://covid19-flutter.000webhostapp.com/register_User.php
    I’ve rendered a bit since i wanted contact number in form instead of email ID. It’s not inserting data and shows loading in app.
    
    Reply
    - admin
      April 14, 2020 at 3:09 am
      
      Faham what changes did you make in my code ? Please tell me and i’ll tell you .
      
      Reply
      - Oguti Brian
        November 11, 2021 at 8:10 am
        
        Hello, i am kindly requesting on how to install http. i think it should be the reason why it is loading in my case.
      - admin
        November 14, 2021 at 2:14 am
        
        Read my this tutorial in this would help you : https://flutter-examples.com/flutter-http-pub-package/ ,
Sujal Shrestha
March 6, 2020 at 12:24 pm

Can we have token serialized
from that

Reply
Sujal Shrestha
March 6, 2020 at 12:31 pm

can we make that password not visible

Reply
- admin
  March 7, 2020 at 3:06 am
  
  Yes we can Sujal, Read my this tutorial https://flutter-examples.com/set-textfield-text-input-type-password-in-flutter/ this would help you.
  
  Reply
Sujal Shrestha
March 8, 2020 at 1:25 pm

i mean can we make that password encrypted in database while registering user

Reply
- rocky
  April 4, 2020 at 2:33 am
  
  @Sujal Shrestha
  You can encrypted password in php file like:-
  
  $password = md5($password);
  
  and insert code
  
  Reply
Laiq
March 9, 2020 at 10:50 am

This is too good, with the shared code, it was ready in minutes otherwise for me it would be 2 to 3 days work.

Thanks Bro

Reply
- admin
  March 10, 2020 at 5:35 am
  
  Welcome Laiq 🙂 .
  
  Reply
  - Reynaldi
    March 10, 2020 at 7:08 am
    
    me too, im stuck in loading and get alot of error. im using online server. can you help me
    
    Reply
    - admin
      March 11, 2020 at 3:12 pm
      
      Tell me Reynaldi, How can i help you ?
      
      Reply
      - khaireen
        April 3, 2020 at 7:29 am
        
        where did you save your php file?
      - admin
        April 6, 2020 at 2:21 am
        
        All of my PHP files is saved on my free 000Webhost hosting account.
Pankaj Kumar
April 2, 2020 at 7:54 pm

Thanks for posting such a nice article. In my case the message “Try Again” written in the PHP script worked with following code:

echo json_encode(‘Try Again’);

Can you post another article for login, home page and logout also? It will make a complete life cycle of this app. If you have already posted article for login, home page and logout then please send me its URL.

Reply
- admin
  April 6, 2020 at 2:20 am
  
  Thanks for comment Pankaj 🙂 . I will post a new tutorial regarding to your query soon .
  
  Reply
Keith D Commiskey
April 24, 2020 at 7:50 am

Hi there,

I’m new to mobile development … do we not need to be concerned with SQL Injection, such as with your using the variables (like $email) directly without any validation?

$Sql_Query = "insert into user_registration (name, email, password) values ('$name', '$email', '$password')";

I really appreciate seeing how a Flutter can talk to PHP. Thank you very much for the walk-through!

Reply
- admin
  April 24, 2020 at 5:28 pm
  
  No there is no need to use SQL injection here.
  
  Reply
SAJJAD
April 27, 2020 at 12:14 am

Can we use even if we installed the app in many devices?

Reply
- admin
  May 3, 2020 at 1:14 am
  
  Yes Sajjad you can use this in many devices because the server is online .
  
  Reply
Owonubi Job Sunday
May 2, 2020 at 11:45 pm

Thanks for the tutorial, would you be kind enough as to help out with tokens when making a connection to a server?
Thanks very much.

Reply
- admin
  May 3, 2020 at 1:20 am
  
  I am currently new in Flutter could you please explain me how you want to use Token ?
  
  Reply
anonymous
May 8, 2020 at 11:23 pm

Hey i am getting try again message whenever i run php file. where is my code wrong can you please help me?

Reply
- admin
  May 9, 2020 at 12:41 pm
  
  On which platform you are running your code like local or online ?
  
  Reply
lorena
May 10, 2020 at 4:58 pm

hello thank you very much for the code, how can we make the password encrypted in this code, ???? I would appreciate if I had a response. thanks

Reply
- admin
  May 12, 2020 at 2:56 am
  
  Lorena which type of password encryption you want ? LIke base 64 ?
  
  Reply
lorena
May 10, 2020 at 6:03 pm

please can someone help me with this erro?
when running the code, the screen of my emulator turns black and this message appears in the terminal:

I/m.example.myapp( 2933): type=1400 audit(0.0:1309): avc: denied { add_name } for name=”build” scontext=u:r:untrusted_app:s0:c512,c768 tcontext=u:object_r:system_data_file:s0:c512,c768 tclass=dir permissive=1
I/m.example.myapp( 2933): type=1400 audit(0.0:1310): avc: denied { create } for name=”build” scontext=u:r:untrusted_app:s0:c512,c768 tcontext=u:object_r:system_data_file:s0:c512,c768 tclass=dir permissive=1
I/1.io ( 2933): type=1400 audit(0.0:1311): avc: denied { remove_name } for name=”CAZAAAACAAAAAAAAAAABGAABAAOAAFAACUAAGAH7777777777777777777777777EAAAGAAAAAAAAAAAAAAAEAAAAAYAAWAA.temp” dev=”sdb3″ ino=81977 scontext=u:r:untrusted_app:s0:c512,c768 tcontext=u:object_r:system_data_file:s0:c512,c768 tclass=dir permissive=1

Reply
Cezar
May 11, 2020 at 5:26 am

hey i’m getting an error, it always return try again, everything is corret, can you help me?

Reply
- Cezar
  May 11, 2020 at 5:27 am
  
  using online server
  
  Reply
- admin
  May 12, 2020 at 2:58 am
  
  Share your online URL with us here, Could you ?
  
  Reply
Fiifi
May 28, 2020 at 5:41 pm

Hello I tried your code but mine keeps loading . I am using an API with authorization

Reply
Fiifi Ofori
May 28, 2020 at 5:43 pm

This is what i did here is my code

var url = ‘http://api.somewebsite.com/a1/connection’;
Map headers1 = {
‘Content-Type’: ‘application/json’,
‘Accept’: ‘application/json’,
‘Authorization’: ‘xxxxxx445684958zxxxxxx’,
};

// Store all data with Param Name.
var data = {‘firstName’: firstName, ‘lastName’: lastName, ’email’: email, ‘mobile’: mobile, ‘password’ : password, ‘confirmPassword’ : confirmPassword};

// Starting Web API Call.
var response = await http.post(url, headers: headers1, body: json.encode(data));

// Getting Server response into variable.
var message = jsonDecode(response.body);

// If Web call Success than Hide the CircularProgressIndicator.
if(response.statusCode == 200){
setState(() {
visible = false;
});
}

// Showing Alert Dialog with Response JSON Message.
showDialog(
context: context,
builder: (BuildContext context) {
return AlertDialog(
title: new Text(message),
actions: [
FlatButton(
child: new Text(“OK”),
onPressed: () {
Navigator.of(context).pop();
},
),
],
);
},
);
}

Reply
ron
May 30, 2020 at 1:34 pm

is it ok to put it inside the form and use formkey for validation?

Reply
- admin
  June 4, 2020 at 3:13 am
  
  Yes Ron it is ok .
  
  Reply
Masudha Meher
June 30, 2020 at 11:00 am

I made some changes to the file, I added these fields: name, number, gender, email and password but when I type in the first field which is the name, all the other fields are being typed in automatically. If possible share your email with me, I will send you a screen recording of it. And in my database, only the 1st column is being saved.

Reply
Masudha Meher
June 30, 2020 at 11:05 am

nevermind, it started working now

Reply
- admin
  July 1, 2020 at 4:17 am
  
  Welcome 🙂 .
  
  Reply
Felix
July 4, 2020 at 1:12 am

Thank you for this tutorial. Do you have any idea why user name does not show in database after successful registration? It is only id, email and password that shows.

Reply
- Bastian
  July 7, 2020 at 7:40 pm
  
  Hi, would you program an app for me for a fee?
  
  Reply
Martin
July 9, 2020 at 2:15 pm

Nice work Bro, you really save my life on this one. Can you please do a tutorial on how to Reset Password in Flutter and Mysql. Thanks in advance.

Reply
sujith
October 4, 2020 at 1:35 pm

Nice work..Thanks a lot..

Reply
Bhadiyadra Vivek
January 9, 2021 at 7:28 am

Hi there,

I’m new to mobile development … do we not need to be concerned with SQL Injection, such as with your using the variables (like $email) directly without any validation?

$Sql_Query = “insert into user_registration (name, email, password) values (‘$name’, ‘$email’, ‘$password’)”;

I really appreciate seeing how a Flutter can talk to PHP. Thank you very much for the walk-through!

Reply
Alex
January 11, 2021 at 9:24 am

i was run this code but this is keep loading but the database is inserted as a null values but id only inserted other filed as empty….pls anyone help me

Reply
divya
February 13, 2021 at 7:35 am

when i click on register button it take too much time to load..

Reply
- admin
  February 14, 2021 at 4:34 am
  
  Divya on which platform you’re testing the app like locally or Online ? Could you share your code with me ? I’ll look into it .
  
  Reply
Afaq
February 14, 2021 at 5:52 am

hi, how we can use this code in local server?

Reply
- admin
  February 18, 2021 at 5:50 am
  
  Afaq you can use this code with Xampp server, I’ll soon make a tutorial to test PHP code in flutter locally.
  
  Reply
Afaq
February 23, 2021 at 5:10 pm

Hi, thanks for the reply, code works properly when I run using chrome emulator, but when I use the android emulator, data is not inserted, just stuck on loading, can you please help me with this?
and your code is very easy to understand, did you already make a tutorial for email verification?

Reply
- admin
  February 25, 2021 at 5:35 am
  
  No Afaq, yet I have not make a tutorial on Email Verification. But I’m working on it. & Could you tell me what changes you have made in the code because I have tested the code in android emulator and it works fine. You could also send me your code on my mail – [email protected] I will look into your code. Drop a comment after sending me the code.
  
  Reply
  - Afaq
    March 1, 2021 at 3:56 pm
    
    hi Admin, very thanks for the reply, i google that and found an answer about that, I just need to add one line in “AndroidManifest.xml” and the line is
    
    and please update us when you have verification tutorial
    .
    
    Reply
    - Afaq
      March 1, 2021 at 3:57 pm
      
      the line is
      
      …
      
      Reply
mohammed
April 27, 2021 at 11:25 am

hello please i have a question. would be glad if you can assist. i have this code with me below. am searching for blood donor base on blood group and rhesus. so once i click on search, am expecting it to fetch the datas from the database, but it wont

Future getData() async {

setState(() {

Navigator.push(context, MaterialPageRoute(builder: (context)=>Search()));
});

String destate=selectedType.toString();
String blood=bloodtype.toString();
String rhesus=rhesustype.toString();
var url=”https://blood.upnepa.com.ng/blood/index.php”;
var data={‘bloodgroup’:blood, ‘rhesus’:rhesus};
var response= await http.post(url, body: json.encode(data));

var message = jsonDecode(response.body);
if(response.statusCode==200){
setState(() {
visible=false;
});
}
else{
showDialog(
context: context,
builder: (BuildContext context){
return AlertDialog(
title: new Text(message),
actions: [
FlatButton(
child: new Text(“OK”),
onPressed: (){
Navigator.of(context).pop();
}
)
],
);
}
);
}

Reply
- admin
  April 27, 2021 at 11:59 am
  
  Mohammed, You are using keyword base searching or Category base searching , so I can personally try it 🙂 .
  
  Reply
desmon
May 9, 2021 at 1:18 am

Bonsoir je veux lire les donnees sur ma BD sur 000webhost
merci de m’aide

class HttpService {
final String postUrl = “https://mademande.000webhostapp.com/histo.php”;

Future<List> getRequests()async{
Response res = await get(postUrl);
print(res.statusCode);
print(res.body);
if(res.statusCode == 200){
List body = json.decode(res.body);
print(body);
List requete = body.map((dynamic item) => Requete.fromJson(item)).toList() ;
var req = requete.toList();
print(“************************”);
print(req);
return req ;
}else{
throw “Can’t get Requete”;
}

}

Reply
hari
November 30, 2021 at 9:12 am

thanks for wonderful Example. Can i get any reference for login please

Reply
- admin
  December 1, 2021 at 10:48 am
  
  Hari read my this tutorial : https://flutter-examples.com/flutter-online-user-login-using-php-mysql-api/ this will help you.
  
  Reply
hari
November 30, 2021 at 9:26 am

Thanks a lot, it’s working. But how to do login and how to check user is existing or not in register table. Please share with Example.

Reply
- admin
  December 1, 2021 at 10:49 am
  
  Hari read my this tutorial https://flutter-examples.com/flutter-online-user-login-using-php-mysql-api/ .
  
  Reply
yan
December 14, 2021 at 12:41 am

Hello, I want to ask, what is the solution for the following error:

E/flutter (24085):
E/flutter (24085): [ERROR:flutter/lib/ui/ui_dart_state.cc(209)] Unhandled Exception: FormatException: Unexpected character (at character 1)
E/flutter (24085):
E/flutter (24085): ^
thank you.

Reply
- admin
  December 15, 2021 at 4:13 am
  
  Yan on which page the Error is coming ? like in this tutorial or some other ?
  
  Reply
Ramazan
September 14, 2022 at 5:39 am

Hi, can you help me, please?

lib/main.dart:28:7: Error: The non-abstract class ‘RegisterUserState’ is missing implementations for these members:
– State.build
Try to either
– provide an implementation,
– inherit an implementation from a superclass or mixin,
– mark the class as abstract, or
– provide a ‘noSuchMethod’ implementation.

class RegisterUserState extends State {
^^^^^^^^^^^^^^^^^
/C:/src/flutter/packages/flutter/lib/src/widgets/framework.dart:1334:10: Context: ‘State.build’ is defined here.
Widget build(BuildContext context);
^^^^^
lib/main.dart:44:3: Error: Method not found: ‘setState’.
setState(() {
^^^^^^^^
lib/main.dart:67:5: Error: Method not found: ‘setState’.
setState(() {
^^^^^^^^
lib/main.dart:74:14: Error: Undefined name ‘context’.
context: context,
^^^^^^^
lib/main.dart:79:11: Error: Method not found: ‘FlatButton’.
FlatButton(
^^^^^^^^^^
lib/main.dart:137:17: Error: Method not found: ‘RaisedButton’.
RaisedButton(
^^^^^^^^^^^^
Failed to compile application.

Reply

Flutter Online User Registration using PHP MySQL Server Tutorial Android iOS Example

Contents in this project Flutter Online User Registration using PHP MySQL Server Tutorial iOS Android Example:

Also Read:

71 Comments

Leave a Reply Cancel reply

Search Here