{hero}

columns.editField

自:Editor 1.4

定義欄位應觸發哪個欄位的編輯。
請注意 - 此屬性需要 DataTables 的 Editor 擴充功能。

描述

Editorinline()bubble() 方法會根據頁面上的特定元素(通常是表格儲存格)觸發個別欄位編輯,並嘗試根據給定的表格儲存格判斷應編輯 Editor 表單中的哪個欄位。

但是,自動偵測並非總是可行,尤其是在使用關聯資料庫表格時,在 DataTable 顯示欄中顯示標籤值很常見,但在編輯列的資料時編輯相關值(例如資料庫 ID 欄)。

此選項提供在透過 inline()bubble() 啟動特定欄位進行編輯時,告知 Editor 應編輯哪個或哪些欄位的功能。

此選項可以接受的值由 Editor 表單使用的欄位名稱定義 (fields.name)。在 Editor 實例中定義的任何欄位名稱都可以用作此處的值。

從 Editor 1.5 開始,對於 bubble() 編輯,此選項可以是欄位名稱陣列,以允許一次顯示多個欄位進行編輯。

類型

此選項可指定為下列類型:

預設值

  • 值:null

Editor 將嘗試根據 DataTables 的初始化選項自動判斷要編輯的欄位。如果無法判斷且未指定 columns.editField 選項,則會發出警告。

範例

使用 editField 選項為最後一欄進行表格內編輯 - 請注意,表格中顯示的資料是 sites.name,而編輯的值是 users.site

$(document).ready(function () {
	var editor = new DataTable.Editor({
		ajax: '../php/join.php',
		table: '#example',
		fields: [
			{
				label: 'First name:',
				name: 'users.first_name'
			},
			{
				label: 'Last name:',
				name: 'users.last_name'
			},
			{
				label: 'Phone #:',
				name: 'users.phone'
			},
			{
				label: 'Site:',
				name: 'users.site',
				type: 'select'
			}
		]
	});

	// Activate an inline edit on click of a table cell
	$('#example').on('click', 'tbody td', function (e) {
		editor.inline(this);
	});

	new DataTable('#myTable', {
		ajax: {
			url: '../php/join.php',
			type: 'POST'
		},
		columns: [
			{ data: 'users.first_name' },
			{ data: 'users.last_name' },
			{ data: 'users.phone' },
			{ data: 'sites.name', editField: 'users.site' }
		]
	});
});