Wijmo Build 5.20162.198 Available

We have just released Build 198 and it includes some nice new features, some new samples and of course bug fixes.

Change Log

• Angular 2: tested against RC.4. Angular2 Info
• Angular 2: added support for Angular forms. The ngForms sample demonstrates the feature. The implementation is based on the *new* forms implementation from the @angular/forms module, instead of *deprecated* forms stuff from the @angular/common module. See the documentation on the new forms stuff here: https://angular.io/docs/ts/latest/guide/forms.html. The dynamic forms scenario described here https://angular.io/docs/ts/latest/cookbook/dynamic-form.html is supported as well. The ngForms sample includes the modified version of the Dynamic Forms example that uses Wijmo input components. Angular 2 ngForms sample
• Modified input controls to support the 'for' attribute of labels. The control modifies the for attribute from targeting the host element so they target the inner input element instead. For example:

  <label for="inputDate">Departure:</label>  
  <wj-input-date id="inputDate"></wj-input-date>
  

  The InputDate will automatically set the id to its inner input element to 'inputDate.input' and will switch the "for" attribute of the label to target the input element instead. InputLabels sample | Building Great Web Forms with Wijmo blog
• Added a new WealthHealth sample to demonstrate dynamic charts. Based on a popular data visualization for the health and wealth of nations. WealthHealth sample | Creating Amazing Dyanmic Charts Using Wijmo blog
• Rewrote parts of the XLSX module to no longer include xlsx.js dependency. This allowed us to remove the restricitve Microsoft copyright and license.
• Added a few class names to FlexGrid elements to enable more flexible CSS-based styling. The new class names are:
  • wj-elem-collapse Element that holds the expand/collapse glyphs in group rows
  • wj-elem-dropdown Element that holds the drop-down glyph in data-mapped cells
  • wj-elem-filter Element that holds the filter glyph in column headers
• Added a "wj-autocomplete-match" class to define the default style used for highlighting AutoComplete matches (can be overridden by the cssClass property).
• Added an AutoComplete.searchMemberPath property that allows you to specify item properties to use when searching (in addition to displayMemberPath).
• Added an 'isReadOnly' property to all input controls (DropDown, InputNumber, Calendar). This prevents users from changing the value, but still allows selection, focus, and events. It is equivalent to the 'readonly' property in HTML input elements, but also prevents editing with the mouse (drop-downs, buttons, wheel).
• Added a selectionMode property to the InputDate and Calendar controls to allow selecting months rather than specific days.
• Added specific class names to derived controls (for example, the ComboBox control host element now has class wj-combobox in addition to wj-control and wj-dropdown).
• Improved CSS to keep InputDate calendar width constant as the user navigates months in IE.
• Added undo/redo processing for inserting/removing chart in FlexSheet. (TFS 191085)
• Added a new 'wj-state-empty' class to controls that contains empty input elements. This class can be used in CSS selectors along with the wj-state-focused class.
• Allow empty strings on masked inputs when "isRequired" is false.

New Samples

• Angular 2 ngForms sample
• WealthHealth sample | Creating Amazing Dyanmic Charts Using Wijmo blog
• InputLabels sample | Building Great Web Forms with Wijmo blog
• How to Use Wijmo in ReactJS Apps blog
• How to Create Great VueJS applications Using Wijmo Controls blog

Breaking Changes

• Replaced some custom attributes used by the FlexGrid control with class names for better W3C compliance and CSS support:

  • "wj-collapse" attribute was replaced with "wj-elem-collapse" class name
  • "wj-dropdown" attribute was replaced with "wj-elem-dropdown" class name
  • "wj-filter" attribute was replaced with "wj-elem-filter" class name

  This change may affect applications that customize the display of node cells. For example, you should replace:

  cell.innerHTML = '<wj-collapse class="glyphicon ...
  

  With:

  cell.innerHTML='<span class="wj-elem-collapse glyphicon ...
  

• Deprecated ' disabled' and 'required' properties on all controls and replaced them with 'isDisabled' and 'isRequired' . This avoids conflicts with HTML attributes in markup. The old properties still work, but will be removed in a future release, so this is not a breaking change yet, but will be.

Get Started

Download Wijmo build 5.20162.198