Yahoo! Блог User Interface (YUIBlog)

Treeble с Юи 3 DataTable

Бета версия на DataTable в Юи 3.3.0 ни дава много мощен компонент, за да играе. Да риташ гуми полезен начин, реших да се актуализира на моите Treeble примери, за да използват DataTable. (Treeble дава възможност за показване на йерархични данни в таблица .)

За моя радост, това беше бриз! Цялата работа се извършва в TreebleDataSource , който се простира Юи 3 източник на данни, така че всичко, което трябваше да направя е да го включите в DataTable от използването Y.Plugin.DataTableDataSource и след това да конфигурирате колоните:

 Var DS = нов Y.TreebleDataSource, (...),
	 PG = за нов Y.Paginator (...),
	 таблица;

 на функция sendRequest () {
	 table.datasource.load ({
		 молбата си: {
			 startIndex: pg.getStartIndex (),
			 resultCount: pg.getRowsPerPage ()
		 }
	 });
 }

 Var Колони = [
     {Ключ: "yui33-рана", етикет: "},
     {
         ключ: "treeblenub", етикета: ",
         на форматирания: Y.Treeble.buildTwistdownFormatter (sendRequest)
     }
     {
         ключ: "титлата", етикет: "дял",
         форматиране: Y.Treeble.treeValueFormatter
     }
     ...
 ];

 таблица = за нов Y.DataTable.Base ({columnset: Колони});
 table.plug (Y.Plugin.DataTableDataSource {източник на данни: DS});

За да видите пълния сорс код, вижте на живо пример .

Единствените мухи в меда са:

• Yui33-хак колона. Поради бъг в Юи 3.3.0 DataTable , td елемент премина към форматиране на колона, всъщност е от предишната колона. Така, първата колона в таблицата показва на twistdown, а втората колона е празна.
• Недефинирани стойности в данните се показват като {value} вместо на заготовки ( бъг 2529858 ).

За да се направи Treeble лесно за използване, която съм добавил кожата Сам, която стилове на класовете на СГО, изписани от Y.Treeble форматиране.

Наслаждавайте се!

За автора: Джон на Lindal ( @ jafl5272 на Twitter) е един от водещите инженери, които изграждат основата, върху която Yahoo! APT е построен. Преди това той е работил в мрежата на Yahoo! Publisher.

Вижте разговори: Bloglines | Technorati

Споделете и разширяване : Запазете си отметка към del.icio.us | Digg тя | Reddit!