原計划本節學習的是編輯和刪除用戶信息,在案例開發過程中發現先把數據列表讀取出來,再對列表的數據進行刪除或修改更為合理,所以調整下學習順序,先進行數據分頁查詢的學習,再對數據進行編輯和刪除。
數據查詢
我們的數據實際是存儲在MySql數據庫中的某個表中,用sql查詢的結果如下圖所示:
但我們不可能要求所有系統使用人員都可以寫T-SQL直接操作數據表,因為便捷性和安全性都很差。人們更想通過界面操作,點幾下鼠標就能對數據進行管理。
我們需要先把數據從數據庫中取出來,讓用戶清楚看的每條記錄的內容,並對數據進行基本操作(增/刪/改)。
數據查詢時系統處理流程:
MySql負責存儲數據、PHP負責把數據從數據庫取出來、html前端負責數據展示。
數據管理時系統處理流程:
用戶在html前端作出操作、PHP根據相應的操作去操作MySql數據表、將處理結果在前端反饋給用戶。
在我們處理完數據查詢,把數據用指定的模板處理之后再展示的樣子如下:
數據分頁
在我們數據量很少或者用戶量很少的情況下,系統查詢數據分頁和不分頁的差別不是很明顯。但是在多用戶、龐大的數據量下分頁是必要的,可以有效降低服務的負載,提高用戶端的數據響應速度。
1.降低服務器負載
假設我們有表A數據量為1萬條,並發用戶有100人。用戶在登錄系統時所有用戶同時請求首頁所用到的A表數據時就會造成並發請求。此時對服務器來說單次請求的數據量是1萬*100也就是100萬。並發的大量的請求勢必會過度消耗服務器的資源。
假設我們有分頁處理,用戶每次登錄首頁,我們只取第一頁前10條數據。當用戶進行翻頁操作時再重新請求另外某頁的10條記錄。此時就算同樣是100個人進行數據請求,每次對服務器的數據請求量只有100*10也就是1000。
經過簡單的對比可以發現數據分頁能夠大幅度降低服務器負載。
2.提高用戶端的數據響應
在不進行數據分頁時,PHP請求到A表中的所有記錄之后,需要處理這些數據,給數據套html模板。此時數據遍歷比較費,如果數據量且網絡帶寬不高時,用戶在登錄之后數據加載很慢嚴重影響用戶使用體驗。
使用數據分頁能夠改善這個問題,每次請求都只請求少量數據,數據從請求到渲染顯示的整個過程都很流暢。
案例關鍵代碼分析
用戶管理列表進行數據分頁操作,默認每頁顯示5條數據,初始加載第一頁的數據。js分頁數據請求如下:
//js分頁數據請求方法 //page 表示第幾頁 //pagesize 表示每頁顯示幾條記錄 function PageInitForGetUser (page,pagesize) { $.ajax({ url: "action/GetAllUser.php", dataType: "json", async: true, data:{ page:page, pagesize:pagesize }, type: "POST", //請求方式 success: function (req) { HtmlStr=""; if (req.length>0) { for (var i = 0; i <=req.length - 1; i++) { HtmlStr+='<tr><td>'+req[i].Id+'</td><td><u style="cursor:pointer" onclick="Show('+req[i].Id+')">'+req[i].username+'</u></td><td >'+req[i].password+'</td><td >'+req[i].sex+'</td><td >'+req[i].phone_number+'</td><td >'+req[i].email+'</td><td >'+req[i].address+'</td><td> '+req[i].create_time+'</td><td class="td-manage"><a href="javascript:;" onclick="Edit('+req[i].Id+')"class="ml-5" style="text-decoration:none"><i class="layui-icon"></i></a><a href="javascript:;" onclick="Delete('+req[i].Id+')" style="text-decoration:none"><i class="layui-icon"></i></a></td> </tr>'; } $("#UserTB").html(HtmlStr); } }, error: function () { alert("數據接口請求錯誤!"); } }); }
PHP分頁數據請求如下:
<?php header("Content-Type: text/html;charset=utf-8"); include '../com/DBHelper.php'; $DB=New DBHelper(); $page=$_POST["page"]; $pagesize=$_POST["pagesize"]; $Resoult=$DB->PageQuerySQL("select * from sys_user where user_type='普通用戶' order by Id desc",$page,$pagesize); echo $Resoult; ?>
前端分頁控件初始化:
$(".zxf_pagediv").createPage({ pageNum: Math.ceil(TOTAL/PAGESIZE),//總記錄/每頁顯示數=總頁數 current: 1,//當前頁數 backfun: function(e) { PageInitForGetUser(e.current,PAGESIZE);//回調函數,根據頁數和頁大小重新取數 } });
后續
下期更新:php+MySQL實戰案例【七】數據編輯、刪除。