dhtmlxSuite是一個用JavaScript建立的富客戶端開發(fā)框架。它是一個JavaScript UI庫，用于建立一個完整的具有Ajax能力的前臺組件。用戶可以使用它建立一個企業(yè)級的跨瀏覽器Web應(yīng)用和移動應(yīng)用程序，它能提供優(yōu)秀的性能和更豐富的用戶體驗。

點擊下載dhtmlxSuite最新版

DHTMLX開發(fā)團(tuán)隊一直在努力開發(fā)Suite JavaScript小部件庫的主要版本。因此，DHTMLX Suite在7.0版中獲得了許多全新的功能。

滿足主要更新的重點：

• 分頁小部件
• 將Suite窗口小部件與Node.js結(jié)合使用的代碼示例
• 用于樣式化小部件的CSS模板
• 觸摸設(shè)備上的完美作品
• 重新設(shè)計了布局，表單和標(biāo)簽欄

DHTMLX分頁[PRO]

與數(shù)據(jù)進(jìn)行交互是用戶在Web應(yīng)用程序中面臨的最大挑戰(zhàn)之一。當(dāng)表中的數(shù)據(jù)行分布在許多頁面上時，必須為用戶提供適當(dāng)?shù)膶?dǎo)航控件。從v7.0開始，DHTMLX Suite附加了JavaScript Pagination小部件，用于在DHTMLX Grid，TreeGrid，Tree，List和DataView中導(dǎo)航內(nèi)容。

請注意，DHTMLX分頁僅在PRO版本中可用。

Node.js演示

CSS窗口小部件模板

我們的主要目標(biāo)之一是加速Web開發(fā)。為了實現(xiàn)這一目標(biāo)，我們在分步指南“如何使用JavaScript創(chuàng)建用戶友好的應(yīng)用程序”中列出了成功應(yīng)用程序的核心設(shè)計原則。在那里，我們揭示了方便導(dǎo)航，數(shù)據(jù)編輯，過濾和樣式設(shè)置的關(guān)鍵點。

我們還提供了一種使用CSS模板在Web應(yīng)用程序中樣式化DHTMLX小部件的新穎方法。現(xiàn)在，您可以選擇所需的小部件外觀，從摘錄中復(fù)制CSS樣式，然后將其應(yīng)用到您的應(yīng)用中。這是一個深色工具欄的示例：

完美的觸控支持

從現(xiàn)在開始，DHTMLX Suite在觸摸設(shè)備上提供所有UI窗口小部件的流暢工作，使最終用戶可以在任何設(shè)備上使用您的應(yīng)用程序享受真正的原生體驗。單擊和雙擊觸發(fā)的所有事件都將保留，并將照常觸發(fā)。您可以通過以下鏈接在移動設(shè)備上測試DHTMLX小部件：https ://snippet.dhtmlx.com/q3cu6x1a?mode=mobile

重做布局

在v7.0中，與以前的版本相比，DHTMLX Layout提供了一種在頁面上排列小部件的新方法。

首先，我們添加了許多預(yù)期的API屬性來管理Layout單元的大小，例如寬度和高度，以自動調(diào)整到內(nèi)容大小maxHeight，maxWidth，minHeight和minWidth。現(xiàn)在，gravity屬性用于指定一個單元相對于同一行中一個父級中其他單元的權(quán)重。

其次，我們介紹了布局單元之間的三種邊界類型：“空間”，“寬”和“線”。這些是“布局”單元格的類型配置屬性的值。具有“空格”類型的單元格周圍具有較大的空間。“寬”類型添加了單元格邊框，僅在同級單元格之間留有寬闊的空間。“ line”類型僅向單元格添加邊框。

如果未指定自己的類型，則子單元格將繼承其父代的邊框類型。因此，您可以快速應(yīng)用必要的布局配置并定義所需的邊框類型，以在視覺上將單元格彼此分離。

返工表格

我們的開發(fā)團(tuán)隊重塑了DHTMLX Form的事件系統(tǒng)，以增強(qiáng)交互性。我們創(chuàng)建了新的Form事件以及各個控件的事件。

在v7.0中，我們還引入了一種新型的表單控件– CheckboxGroup。它代表在一個塊中排列在一起的一組復(fù)選框。CheckboxGroup擁有自己的API，其中包含用于控制其外觀的方法和屬性。

此外，DHTMLX表單中還出現(xiàn)了一個新的Spacer元素。它可以通過占用控件之間的空間來分離控件。了解有關(guān)Spacer及其API的更多信息>

minlength，maxlength，min和max這樣的HTML屬性現(xiàn)在可用于Input和Textarea控件。

我們添加了一個新屬性，用于在RadioGroup控件中指定初始值。

此外，v7.0還提供了借助新API方法setFocus和focus（）將焦點設(shè)置在指定的Form控件上的功能。

標(biāo)簽欄：大小，對齊方式，內(nèi)容溢出

DHTMLX Tabbar獲得了用于控制標(biāo)簽大小的新API屬性。從v7.0開始，您可以在tabWidth和tabHeight屬性的幫助下定義每個選項卡的大小。此外，現(xiàn)在可以通過tabAutoWidth和tabAutoHeight屬性將標(biāo)簽的寬度和高度自動調(diào)整為容器的大小。

在v7.0中，您可以借助tabAlign屬性輕松地將選項卡左，中或右對齊。

如果容器溢出了選項卡中的內(nèi)容，則用戶可以在外觀漂亮的箭頭的幫助下在選項卡之間切換，并平滑地滾動選項卡。

Grid和TreeGrid：隱藏和顯示行

拖放事件

其他更新

• 改進(jìn)了DataCollection的排序和篩選方法。每當(dāng)數(shù)據(jù)集更改時，就會出現(xiàn)新的smartSorting方法來對數(shù)據(jù)進(jìn)行排序。
• 事件集合已更新，并豐富了Form，TimePicker，Tree和TreeGrid小部件。DataView，Grid和List小部件可以將事件偵聽器添加到項目的自定義模板中。
• Selection API已在Tree，List，DataView和Grid小部件中更新。
• 例如，可以訪問和操作Grid標(biāo)頭中的過濾器，從而專注于您選擇的過濾器，進(jìn)行更改或清除。
• 在菜單，工具欄和功能區(qū)小部件中創(chuàng)建了用于操縱項目選擇的新API方法。
• 在小部件初始化期間用于設(shè)置初始值的屬性值已添加到ComboBox和TimePicker小部件中。