Tutorial jQuery EasyUI menu pohon - menu Pohon menambahkan orang tua / node anak Terbaik Pada tahun 2024, Dalam tutorial ini Anda dapat mempelajari Ambil jQuery EasyUI contoh,

jQuery EasyUI menu pohon - menu Pohon menambahkan orang tua / node anak

Biasanya itu merupakan simpul pohon dalam setiap cara node menyimpan parentid a. Ini juga disebut daftar adjacency Model. beban langsung data ke pohon menu (Pohon) tidak diperbolehkan. Tapi kita bisa sebelum pohon memuat menu, memasukkannya ke dalam standar pohon menu (Pohon) format data standar. Pohon (tree) plug-in menyediakan pilihan yang 'loadFilter' berfungsi, dapat mencapai fungsi ini. Ini memberikan kesempatan untuk mengubah salah satu data yang masuk. Tutorial ini menunjukkan kepada Anda bagaimana menggunakan fungsi orang tua 'loadFilter' untuk memuat / node anak ke menu tree (pohon).

Induk Data node / anak

	[
	{ "Id": 1, "parendId": 0, "nama": "Makanan"},
	{ "Id": 2, "ParentID": 1, "nama": "Buah"},
	{ "Id": 3, "ParentID": 1, "nama": "Sayuran"},
	{ "Id": 4, "ParentID": 2, "name": "apel"},
	{ "Id": 5, "ParentID": 2, "name": "orange"},
	{ "Id": 6, "ParentID": 3, "nama": "tomat"},
	{ "Id": 7, "ParentID": 3, "nama": "wortel"},
	{ "Id": 8, "ParentID": 3, "nama": "kubis"},
	{ "Id": 9, "ParentID": 3, "nama": "kentang"},
	{ "Id": 10, "ParentID": 3, "nama": "selada"}
	]

Gunakan 'loadFilter' Buat pohon menu (Pohon)

	$ ( '# Tt'). Pohon ({
		url: 'data / tree6_data.json',
		loadFilter: function (baris) {
			kembali convert (baris);
		}
	});

Realisasi Konversi

	mengkonversi fungsi (baris) {
		fungsi ada (baris, ParentID) {
			for (var i = 0; i <rows.length; i ++) {
				if (baris [i] .id == ParentID) kembali benar;
			}
			return false;
		}
		
		var node = [];
		// Dapatkan node tingkat atas
		for (var i = 0; i <rows.length; i ++) {
			baris var = baris [i];
			if (! ada (baris, row.parentId)) {
				nodes.push ({
					id: row.id,
					Teks: row.name
				});
			}
		}
		
		var Todo = [];
		for (var i = 0; i <nodes.length; i ++) {
			toDo.push (node ​​[i]);
		}
		sementara (toDo.length) {
			var simpul = toDo.shift (); // induk simpul
			// Dapatkan node anak
			for (var i = 0; i <rows.length; i ++) {
				baris var = baris [i];
				jika (row.parentId == node.id) {
					anak var = {id: row.id, teks: row.name};
					jika (node.children) {
						node.children.push (anak);
					} Lain {
						node.children = [anak];
					}
					toDo.push (anak);
				}
			}
		}
		kembali node;
	}

Ambil jQuery EasyUI contoh

jeasyui-tree-tree6.zip

jQuery EasyUI menu pohon - menu Pohon menambahkan orang tua / node anak
10/30