Skip to end of metadata
Go to start of metadata

WebInput 5 is a major release that sports a completely redesigned user interface based on the new Unified Theming framework introduced in the WebUI Studio 2016 release. Building on its advanced features, WebInput 5 leverages the latest web technologies and front-end trends optimized for modern browsers like Chrome, Safari, and Edge. The new WebInput lets you easily add advanced data entry functionality to your ASP.NET web project with simple drag-drop, while delivering beautiful design that naturally suitable to modern web applications today.

More importantly, this release adds a new modern theme that you can apply with the simplicity of xcopy. Beyond just basic styling, the modern theme includes comprehensive styling for all WebInput user interface, as well as adding support for Bootstrap validation styles. In addition, this release provides full support for latest major browsers including Internet Explorer 11, Edge, Safari for Mac, Chrome 47 and Firefox 42.

Download WebInput 5 today.

 


This page guides you through the new features and enhancements available in WebInput 5. Click the links below to jump to the section of your interest.

 

 

Unified Theming Support

In this release, WebInput has been significantly enhanced to fully support unified theming capability introduced in WebUI Framework 4. In general, these are the key area of improvements to support unified theming:

  • Inline styles are now removed in favor to CSS styles which reduce markup and page output in overall.
  • Instance-level styles and default stylesheets are no longer rendered, enabling the page to load much faster.
  • Provide attribute-based states for streamlined styling through CSS3 selectors.
  • Enhanced both server-side and client-side rendering to support modern HTML5 and CSS3 markup/syntax.

For more information, see Unified Theming.

New Unified Modern Theme

One of the biggest updates in this release is the introduction of brand-new modern theme for WebInput. Building on the new unified theming framework, WebInput's new theme leverages the most popular CSS framework, Bootstrap. Unlike previous versions, WebInput automatically uses shared/common styles when the unified theming feature is enabled. When the common styles are modified, WebInput and the other WebUI components that present similar semantic will be automatically updated.

At a glance, the WebInput modern theme key highlights are:

  • Based on Bootstrap 3.3
  • Written in SCSS language
  • Redesigned with clean and modern styles
  • Meticulously designed, pixel-perfect styling on over 100+ elements and editors
  • Control resources now use scalable vector graphic (SVG) in favor to low-res images

The following screenshot shows a basic WebInput in action with the new modern theme.

For more information about the theme features and how to apply the theme in your web projects, see WebInput Theming Overview. To see the complete style reference available in the Modern Theme, see WebInput Modern Theme Style Reference.

Support Bootstrap Semantics

WebInput 5 now also supports Bootstrap semantics such as size classes, contextual styles, form group, and validation styles.



These styles can be implemented to the new WebInput by adding the desirable class to WebInput's FrameStyle. For more information on how to apply them, see WebInput Theming Overview.

New ValidationState API

WebInput 5 supports built-in validation styles available in the WebUI unified theme and also adds integration to ASP.NET validators. When the associated validator returns an invalid result, WebInput automatically updates its styles with an error style. Likewise, the styles will be updated accordingly when the input satisfies the validators. In addition, WebInput also introduces OnValidate client-side event which will be invoked whenever the validator is performing validation on the WebInput control. WebInput also provides a new SetValidationState API allowing you to change the contextual color programmatically. 

These new API allows you to implement custom validation process. For instance, you might want to update the WebInput with success contextual color when the validation returns a valid value. You can easily achieve this scenario by handling the OnValidate event to intercept the validation process, then call the SetValidationState method accordingly. Take a look at the example below.

Theme Support for Built-in ASP.NET Validators

The new WebInput 5 also supports theme for ASP.NET validators, see the illustration below.

To apply these styling, set the validator's CssClass property to the desired class, for complete information, see WebInput Theming Overview.

Latest Browser Support

WebInput 5 has been significantly improved to support the following browsers:

  • Internet Explorer 11
  • Edge
  • Safari Mac 9.0
  • Chrome 48
  • Firefox 44

 

Updates and fixes in this release

This release includes the following updates and bug fixes:

Loading …
9 issues Refresh

Since WebInput 5 is a major release, the WebInput updates are not available via Update Manager channel. Please install from the latest setup for the best development experiences which includes new project templates and other IDE enhancements.

 

Related Topics