jQuery EasyUI アプリ - CRUD アプリの作成

データ収集とデータの適切な管理は、ネットワーク アプリケーションにとって一般的な必要性です。 CRUD を使用すると、ページ リストを生成し、データベース レコードを編集できます。このチュートリアルでは、jQuery EasyUI フレームワークを使用して CRUD DataGrid を実装する方法を示します。

jQuery EasyUI アプリ - CRUD アプリの作成 構文

次のプラグインを使用します:

datagrid: リスト データをユーザーに表示します。

ダイアログ: 単一のユーザー メッセージを作成または編集します。

form: フォーム データを送信するために使用されます。

messager: 操作情報を表示します。

jQuery EasyUI アプリ - CRUD アプリの作成 例

<table id="dg" title="My Users" class="easyui-datagrid" style="width:550px;height:250px"        url="get_users.php"        toolbar="#toolbar"        rownumbers="true" fitColumns="true" singleSelect="true">    
    <thead>        
        <tr>            
            <th field="firstname" width="50">First Name</th>            
            <th field="lastname" width="50">Last Name</th>            
            <th field="phone" width="50">Phone</th>            
            <th field="email" width="50">Email</th>        
        </tr>    
    </thead>
</table>
<div id="toolbar">    
    <a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">New User</a>    
    <a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">Edit User</a>    
    <a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyUser()">Remove User</a>
</div>