如何根据输入的TextField值显示MySQL查询结果

时间:2020-03-22 01:23:19

标签: flutter flutter-listview flutter-card

我对Flutter并不陌生,并且想了解如何根据用户输入的TextField值显示MySQL查询结果。

当我是Flutter的新手时,我从其他教程中刮了一些零碎的片段,以尝试取得成果。

一些帮助将不胜感激,因为我为此苦苦挣扎了数周。这是对我的问题的重新编辑,因为我正试图更具描述性,希望有人可以恳求帮助。谢谢

这是我的MySQL表: My MySQL table

这是我的PHP文件(flutter_data.PHP)

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

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

$obj = json_decode($json,true);

$name = $obj['name'];//this value coming from TextField ( i hope :-)) 

$CheckSQL = "SELECT * FROM Student_data WHERE student_name = '$name'";

$result = $con->query($CheckSQL);

if ($result->num_rows >0) {

 while($row[] = $result->fetch_assoc()) {

 $Item = $row;

 $json = json_encode($Item, JSON_NUMERIC_CHECK);

 }

}else {

 echo "No Results Found.";

}

echo $json;

$con->close();
?>

我做了一个测试,看我的PHP文件是否在没有WHERE子句的情况下可以工作。在下面运行我的PHP文件。

enter image description here

我的主屏幕由TextField,Image,FlatButton组成

enter image description here

设置类变量:


 int studentID;
 String studentName;
 int studentPhoneNumber;
 String studentSubject;

  Studentdata({
    this.studentID,
    this.studentName,
    this.studentPhoneNumber,
    this.studentSubject
  });

  factory Studentdata.fromJson(Map<String, dynamic> json) {
    return Studentdata(
      studentID: json['id'],
      studentName: json['student_name'],
      studentPhoneNumber: json['student_phone_number'],
      studentSubject: json['student_class']

    );
  }
}

我已将TextField设置为捕获onChanged值

 onChanged: (value) {

                setState(() {

                    name = value;

带有onPressed的我的FlatButton:

onPressed: () {


                  var route = new MaterialPageRoute(

                    builder: (BuildContext context) => new NextPageState(name.toString(),                           


                  ));
                  Navigator.of(context).push(route);
                },

NextPage下面的代码:

class NextPageState extends StatefulWidget {

  final String name;

  NextPageState(this.name);

  @override

  State<StatefulWidget> createState() {

    return NextPage(this.name);

  }
}

class NextPage extends State<NextPageState> {

  final String name ;

  NextPage(this.name);

  // API URL
  var url = 'https://www.datashine.co.za/flutter_data.php';

  Future<List<Studentdata>> fetchStudent() async {

    var data = {'name': name};

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

    if (response.statusCode == 200) {

      print(response.statusCode);

      final items = json.decode(response.body).cast<Map<String, dynamic>>();

      List<Studentdata> studentList = items.map<Studentdata>((json) {
        return Studentdata.fromJson(json);
      }).toList();

      return studentList;

      }

    else {
      throw Exception('Failed to load data from Server.');
    }
  }

  @override
Widget build(BuildContext context) {
  return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text(name),
          automaticallyImplyLeading: true,
          leading: IconButton(icon:Icon(Icons.arrow_back),
          onPressed:() => Navigator.pop(context, false),
        )
      ),
      body: FutureBuilder<List<Studentdata>>(
      future: fetchStudent(),
      builder: (context, snapshot) {

      if (!snapshot.hasData) return Center(
        child: CircularProgressIndicator()
      );

        return ListView(
      children: snapshot.data
      .map((data) => Column(children: <Widget>[

        GestureDetector(
          onTap: (){print(data.studentName);},
          child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [

          Padding(
          padding: EdgeInsets.fromLTRB(0, 20, 0, 10),
          child: Text('Name = ' + data.studentName.toString(),
            style: TextStyle(fontSize: 21))),



                  ]),)
                 ],))
           .toList(),
              );
             },
            )
          ));
         }
        }

在运行App时,似乎没有结果返回。所以我不知道如何解决。循环进度指示器只是加载并挂起。

enter image description here

0 个答案:

没有答案