jQuery EasyUI + php + mySQL 实现数据显示

1.首先我们需要在mysql数据库中建立一个表，如图：

我通过navicat 访问本地的mysql数据库，并且新建了一个数据库，名字叫做test。

在test数据库中新建了一个名为users的表，表中插入了五行数据。

2.然后我们编写php代码，获取这个表中的所有数据，并将数据以json格式显示在页面中。直接上代码：

'127.0.0.1:3306',
    'db'      =>'test',
    'db_user'=>'root',
    'db_pwd' =>'123456',
);
$mysqli=new mysqli($mysql_conf['host'],$mysql_conf['db_user'],$mysql_conf['db_pwd']);
if($mysqli->connect_errno){
    die("could not connect to the database:\n" . $mysqli->connect_errno);//诊断连接错误
}
$mysqli->query("set names 'utf8';");//编码转换
$select_db = $mysqli->select_db($mysql_conf['db']);
if(!$select_db){
    die("could not connect to the db:/n" . $mysql->error);
}
$sql = "select * from users;";
$res = $mysqli->query($sql);
if(!$res){
    die("sql error:/n" . $mysqli->error);
}
$result = array();
while ($row = $res->fetch_assoc()){
    /*var_dump($row);*/
    array_push($result,$row);
}
echo json_encode($result);
$res->free();
$mysqli->close();

?>

运行程序，得到如下页面：

3.通过jQuery EasyUI 将数据显示出来。

我用的php的编译器是JetBrains PhpStorm，

上面php的文件名为get_users.php，

我们在此文件目录下新建一个html文件，并将easyUI文件夹拷贝到此目录下，如图：

那么我们新建的html文件的代码：

    
    
    
    
    
    
    



    

    

        
First Name
        
Last Name
        
Phone
        
Email
    
    


    New User
    Edit User
    Remove User

运行效果图：

成功将数据库内的数据在页面上显示了出来。