บทช่วยสอน jQuery EasyUI ตารางข้อมูล - แถบเครื่องมือ ที่ดีที่สุดในปี 2024 ในบทช่วยสอนนี้ คุณสามารถเรียนรู้ ดาวน์โหลดตัวอย่าง jQuery EasyUI,

jQuery EasyUI ตารางข้อมูล - แถบเครื่องมือ

ตัวอย่างนี้แสดงให้เห็นถึงวิธีการเพิ่มแถบเครื่องมือ (แถบเครื่องมือ) ไปยังตารางข้อมูล (DataGrid)

การสร้างตารางข้อมูล (DataGrid)

	<table id = "TT" class = "easyui-DataGrid" style = "width: 600px; ความสูง: 250px"
			url = "ข้อมูล / datagrid_data.json"
			title = "DataGrid กับ Toolbar" iconCls = "ไอคอนบันทึก"
			แถบเครื่องมือ = "# TB">
		<thead>
			<tr>
				<ฟิลด์ Th = "Itemid" width = "80"> รหัสรายการ </ TH>
				<ฟิลด์ Th = "ProductID" width = "80"> รหัสสินค้า </ TH>
				<Th ฟิลด์ = "listprice" width = "80" align = "สิทธิ"> ราคา </ TH>
				<ฟิลด์ Th = "unitcost" width = "80" align = "สิทธิ"> ต้นทุนต่อหน่วย </ TH>
				<Th ฟิลด์ = "ATTR1" width = "150"> แอตทริบิวต์ </ TH>
				<ฟิลด์ Th = "สถานะ" width = "60" align = "center"> สมรส </ TH>
			</ tr>
		</ thead>
	</ table>
	<div id = "วัณโรค">
		<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="javascript:alert('Add')"> เพิ่ม </a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-cut" plain="true" onclick="javascript:alert('Cut')"> ตัด </a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="javascript:alert('Save')"> บันทึก </a>
	</ div>

เราไม่จำเป็นต้องเขียนโค้ดจาวาสคริปต์ใดก็ได้เพียงแค่ 'แถบเครื่องมือ' คุณสมบัติแถบเครื่องมือที่แนบมา (แถบเครื่องมือ) ไปยังตารางข้อมูล (DataGrid)

ดาวน์โหลดตัวอย่าง jQuery EasyUI

jeasyui-datagrid-datagrid4.zip

jQuery EasyUI ตารางข้อมูล - แถบเครื่องมือ
10/30