1. Home
  2. jQueryのEasyUIデータグリッド - 複雑なツールバーを作成

jQueryのEasyUIデータグリッド - 複雑なツールバーを作成2024 年の最新の入門チュートリアル。このコースでは jQueryのEasyUI例をダウンロード, について学習できます。

jQueryのEasyUIデータグリッド - 複雑なツールバーを作成

データグリッド（データグリッド）ツールバー（ツールバー）は、ボタンや他の成分を含むことができます。 あなたは簡単にカスタムツールバーのレイアウトは、DIVタグは、データ・グリッド（データグリッド）ツールバーの内容になりますように既存のDIVタグを渡すことができます。 このチュートリアルでは、複雑なデータグリッドツールバー（データグリッド）コンポーネントを作成する方法を紹介します。

ツールバーを作成します（ツールバー） 

	<DIVのID = "TB"スタイル= "パディング：5pxの;高さ：オート">
		<DIVのスタイル= "マージン底：5pxの">
			<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true">します</a>
			<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true">します</a>
			<a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true">します</a>
			<a href="#" class="easyui-linkbutton" iconCls="icon-cut" plain="true">します</a>
			<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true">します</a>
		</ DIV>
		<DIV>
			日：<入力クラス= "easyui-datebox"スタイル= "幅：80px">
			To：<入力クラス= "easyui-datebox"スタイル= "幅：80px">
			言語： 
			<入力クラス= "easyui-コンボボックス"スタイル= "幅：100pxに"
					URL = "データ/ combobox_data.json」
					valueField = "ID"のtextField = "テキスト">
			<a href="#" class="easyui-linkbutton" iconCls="icon-search">検索します</a>
		</ DIV>
	</ DIV>

作成データグリッド（DataGridの） 

	<Tableクラス= "easyui-データグリッド"スタイル= "幅：600PX;高さ：250ピクセル"
			URL = "データ/ datagrid_data.json」 
			タイトル= "DataGridの - 複雑なツールバー」ツールバー="＃tbの」
			singleSelect = "true"をfitColumns = "真">
		<THEAD>
			<TR>
				アイテムID </目> <Thのフィールドは=幅= "60" "のItemID">
				<Thのフィールド= "商品コード"幅= "80">プロダクトID </目>
				<Thのフィールド= "listprice" ALIGN = "右"幅= "70">価格</目>
				<Thのフィールド= "unitcost"揃える= "右"幅= "70">単価</目>
				<Thのフィールド= "ATTR1"幅= "200">住所</目>
				<Thのフィールド= "ステータス"幅= "50">ステータス</目>
			</ TR>
		</ THEAD>
	</表>

あなたが見ることができるように、同様のデータグリッド（データグリッド）ツールバーフィールド]ダイアログボックス（ダイアログ）。 私たちは、あなたが複雑なデータ・グリッド（データグリッド）を持つツールバーを作成することができ、任意のJavaScriptコードを記述する必要はありません。

jQueryのEasyUI例をダウンロード

jeasyui-datagrid-datagrid19.zip

ホットチュートリアル

お問い合わせ

jQueryのEasyUIデータグリッド - 複雑なツールバーを作成
10/30