EasyUI是一個基于jQuery的UI插件集合,可以快速開發出美觀、易用的Web界面。而PHP是一門流行的服務器端腳本語言,可以幫助開發人員快速構建動態Web內容。結合使用EasyUI和PHP可以大大提高Web開發效率,下面我們來探討一下它們的聯合應用。
首先來看一個簡單的例子:使用EasyUI的DataGrid組件展示從PHP獲取的數據。以下是PHP代碼:
$servername = "localhost"; $username = "username"; $password = "password"; $dbname = "myDB"; // 創建連接 $conn = new mysqli($servername, $username, $password, $dbname); // 檢查連接 if ($conn->connect_error) { die("Connection failed: " . $conn->connect_error); } $sql = "SELECT id, firstname, lastname FROM MyGuests"; $result = $conn->query($sql); $data = array(); if ($result->num_rows >0) { while($row = $result->fetch_assoc()) { $data[] = $row; } } // 輸出JSON格式的數據 echo json_encode($data);
上面的代碼首先連接到數據庫,查詢MyGuests表中的id、firstname和lastname字段,并將查詢結果轉換成JSON格式,最后輸出給調用方。
接下來是前端代碼,使用EasyUI的DataGrid組件展示從PHP獲取的數據:
<table id="dg"></table> <script> $(function(){ $('#dg').datagrid({ url:'get_data.php', columns:[[ {field:'id',title:'ID',width:100}, {field:'firstname',title:'First Name',width:100}, {field:'lastname',title:'Last Name',width:100} ]] }); }); </script>
上面的代碼使用jQuery調用EasyUI的DataGrid組件,指定從get_data.php獲取數據,并設置列名和對應的字段名。EasyUI會自動將獲取的JSON數據渲染成表格展示。
除了用于展示數據,EasyUI還具有很多其他的組件可以快速構建Web界面,例如表單組件、日期選擇器、樹形控件等等。以下是一個使用EasyUI和PHP實現搜索功能的例子。
<form id="fm" method="post"> <input type="text" name="keyword" class="easyui-textbox" prompt="請輸入關鍵字"> <a href="#" class="easyui-linkbutton" onclick="searchKeyword()">搜索</a> </form> <script> function searchKeyword(){ $('#dg').datagrid('load',$('#fm').serialize()); } $('#dg').datagrid({ url: 'search.php', pagination:true, rownumbers:true, columns:[[ {field:'id',title:'ID',width:100}, {field:'name',title:'姓名',width:100}, {field:'age',title:'年齡',width:100} ]] }); </script>
上面的代碼定義了一個搜索表單,其中包含一個文本框和一個搜索按鈕,當用戶點擊搜索按鈕時,會將表單的數據傳給名為search.php的PHP腳本,然后使用EasyUI的DataGrid組件展示搜索結果。
以上是EasyUI和PHP結合使用的一些例子,它們可以幫助開發人員快速構建出美觀、易用的Web界面,提高開發效率。
上一篇oracle 書
下一篇python的js使用