Sencha.com

Sencha - JavaScript Grid and UI Components

Sencha

Announcing Sencha Ext JS 6.7 and Tooling GA

| Sandeep Adwankar

On behalf of the entire Sencha team, we’re excited to announce the release of Sencha Ext JS 6.7 with major enhancements to the Modern toolkit. The Ext JS 6.7 Modern toolkit now supports grid filtering, grid locking, virtual scrolling for infinite grid, material chip, multiselect combobox and color picker. The Ext JS 6.7 Classic toolkit now includes multiple component enhancements to grid, calendar, panel, charts, window, combobox, tabs and dashboard. The JetBrains, Eclipse and Visual Studio plugins now support the latest IDE versions.

Highlights of Ext JS 6.7 and Tooling

New Modern features in this release include:

  • Grid Filtering – Easily display grid records that meet multiple criterias of text, boolean, date, number filters.
  • Locking Grid – Similar to Excel, lock columns in left or right region.
  • Chip – Material design inspired compact component with thumbnail and text.
  • Multiselect Combobox – Combobox with ability to select multiple chips.
  • Multiselect Select – Easily select multiple values in the select field.
  • Color Picker – Beautiful color picker with HSVA and RGB options

Ext JS tooling updates in this release include:

  • ExtGen – New open tooling templates to support Ext JS 6.7
  • Sencha Cmd – Enhanced control over application compression options
  • JetBrains IDE Plugin – supporting the latest 2018+ versions
  • Eclipse IDE plugin – supporting the latest Eclipse Neon, Oxygen and Photon
  • Visual Studio IDE plugin – supporting Visual Studio 2017
  • 4 Ext JS Examples – supporting Ext JS 6.7 and open tooling

Try Ext JS 6.7

*Note: npm requires you to replace @ in login with “..”. For example, if your login to support portal is firstname.lastname@sencha.com, your login to npm registry will be firstname.lastname..sencha.com. You can use your existing support portal password.

Upcoming Webinar

Join us for our upcoming webinar where you will learn about the key capabilities of Sencha Ext JS 6.7 and Ext JS Tooling.

Register Now

Learn What’s New in Sencha Ext JS 6.7 and Ext JS Tooling
Date: Wednesday, February 20, 2019
Time: 10am PST / 1pm EST

What’s New in Sencha Ext JS 6.7

Grid Filtering

Ext JS 6.7 Modern Grid provides grid filtering, so that end-users can display grid records that meet specified criteria. Apart from text filter, the grid column filter supports the following grid filters:

  1. Text grid filter that limits results to values matching specific text.
  2. Boolean grid filter that limits results to values matching true or false.
  3. Date grid filter that limits results to values matching specific date constraints.
  4. Number grid filter that limits results to values matching specific number constraints.

A Kitchensink example is provided that shows all of the capabilities of Grid filter plugin, including ability to manage all filters globally.

Ext JS Grid Filtering Kitchensink Example

Grid Locking

Ext JS 6.7 Modern Grid provides Locking Grid, so that end-users can lock columns or “freeze pane” similar to Excel. The locking grid provides a column menu that provides users with the ability to lock a grid column on the left region or right region. The locking grid column menu will show current locked status.

Ext JS Grid Locking Kitchensink Example

Chip/Tags

Ext JS 6.7 provides compact material Chip that can be used in common user experience tasks like making a selection, filtering content and triggering actions. The chip component view with thumbnail and text can be created as shown below. You can configure displayTpl to provide different chip views for desktop vs mobile.

chipView: {
                iconField: 'avatar',
                displayField: 'name',
                platformConfig: {
                    '!phone': {
                        displayTpl: '{name} ({email})'
                    }
                }
            },

Modern Triton XD Button Stencils

Multiselect Combobox and Select

Ext JS 6.7 provides Multiselect Combobox, so that end-users can see multiple selected values as tags in the combobox. A standard comboBox combines a traditional HTML text input field and a select field. If the editable config is true, then the user is able to type freely into the field, and/or pick values from a dropdown selection list. The Multiselect combobox also provides the option for “multiselect: true”, allowing end users to select multiple values in a combobox. The selected values can be navigated using keyboard arrow keys and can be deleted with the delete key.

Modern Triton XD Button Stencils

Ext JS Email Form Kitchensink Example

Ext JS 6.7 also provides Multiselect Select, so that end-users can select multiple values in the select field.

Modern Triton XD Button Stencils

Ext JS Register Form Kitchensink Example

Color Picker

Ext JS 6.7 provides Color Picker, so that end-users can select the color picker using color swatch, form field or color selector. The color picker provides options to select color using HSVA or RGB.

Modern Triton XD Button Stencils

Ext JS Color Picker Kitchensink Example

Virtual Scroller

Ext JS 6.7 provides a virtual scroller that allows for scroll range beyond a browser’s normal scroll range. Virtual scrolling is used by default for all infinite lists and grids. This allows for a number of rows far greater than a browser’s normal maximum scroll range.

scrollable: {
        type: 'virtual',
        infinite: true  // enable MAX_SAFE_INTEGER scroll
    },

Modern Triton XD Button Stencils

What’s New in Ext JS 6.7 Tooling

ExtGen Templates

ExtGen 6.7 now contains updated templates for creating desktop as well as mobile applications that support the Ext JS 6.7 framework. The templates allow you to use both Classic and Modern toolkit. You can create desktop and mobile applications using just Modern toolkit or create universal applications with both Classic and Modern toolkits.

Better Compression with Sencha Cmd

Sencha Cmd 6.7 ships with an upgraded closure compiler that enhances your control over compression options. Cmd 6.7 provides you with options to easily change compression levels to enhance code obfuscation and reduce footprint size to meet your requirements. The closure compiler API provides different levels of compression and release notes include examples on using those options.

JetBrains 2018+ IDE support

JetBrain IDE plugins are updated to support apps generated using ExtGen and available in a href=”https://plugins.jetbrains.com/plugin/7740-sencha-ext-js”>marketplace. The Code completion, code generation, code navigation, code inspection, code refactoring and documentation lookup are now supported for ExtGen apps. The updated plugin supports the latest JetBrains IDEs that include IntelliJ 2018+, WebStorm 2018+, PhpStorm 2018+, RubyMine 2018+ and PyCharm 2018+.

Modern Triton XD Button Stencils

Eclipse Latest IDE support

Eclipse IDE plugins now support apps generated using ExtGen and available in a href=”https://marketplace.eclipse.org/content/sencha-eclipse-plugin”>marketplace.. The Eclipse plugin now supports Eclipse IDEs Neon, Oxygen and Photon. The code completion, code generation, code navigation and documentation lookup are now supported for all new Eclipse IDEs.

Modern Triton XD Button Stencils

Visual Studio 2017 support

Sencha Visual Studio Plugin is now supported for Visual Studio 2017 and available in marketplace. Visual Studio 2017 IDE Plugin supports a consistent code completion experience inside the IDE for:

  • Config, method and property names for all Ext JS and user classes
  • Alias properties such as xtype, controller, viewModel and layout
  • Event names and listeners objects
  • Controller methods in listeners
  • Properties from the ViewModel in bind configs

Note: To enable Ext JS code completion support, you will need to disable the VS2017 JavaScript language service.
The Sencha Visual studio plugin supporting 2015 continues to be available in marketplace.

Modern Triton XD Button Stencils

Ext JS 6.7 Examples

Ext JS 6.7 provides a number of examples that are built using open tooling. You can use these apps to get started quickly with Ext JS 6.7 and open tooling:

  • Full Stack Employee Directory (Coworkee) application – Github Repo
  • Full Stack Progressive Web App (PWA) Application – Github Repo
  • Modern Tutorial Sample Application – Github Repo
  • Quick Start Sample Application – Github Repo

More Features and Performance Improvements

Ext JS 6.7 includes updates and enhancements to multiple components as well as bug fixes in both the Modern and Classic toolkit. The Ext JS 6.7 Classic toolkit includes multiple enhancements to grid, calendar, panel, charts, window, combobox, tabs and dashboard. Ext JS 6.7 withstood extensive testing phases including automated testing with Sencha Test, resulting in more than thousand test cases.

Try It and Share Your Feedback

We’re looking forward to seeing the awesome web applications you create with Ext JS. We hope you enjoy building apps with Ext JS 6.7 and look forward to reading your feedback in the Ext JS forum.

Comments

  6. George Palmer says

    So nothing new in the Modern framework then.

    All those features were written in 2017 by Sencha engineers, and have been sat on until now.

    Exactly what has been happening for 18 months?

    Reply

      • Mitchell Simoens says

        Sorry man, a user has the right to ask this. We talked about things in this release for a long time now. It was in the 6.6.0 branch when the acquisition happened. When Idera worked on the 6.6.0 that they released, they instead dumped it to debase off of 6.5.3 and that enabled them to spoon feed the features.

        So George Palmer is not a troll but is a frustrated user asking a legit question.

        Reply

      • Mitchell Simoens says

        Oh and since you’re never around me, you don’t know that I have said that it’s Idera’s prerogative to do what they please with their properties but just don’t expect users to approve of their decisions.

        Reply

  7. MIT hell Simoens says

    MY I ask what your QA process is? I know there are lots of unit tests that we ran on Saucelabs but we also contracted a human QA team that I know was stopped right away after the acquisition. What is your release process in terms of ensuring things look right and work? There are big issues that should have been caught prior to releasing.

    Is this the quality that we can expect? I don’t mean to be that disgruntled ex-employee but I’d Be asking this even if I wasn’t an ex-employee (and I wasn’t one of the laid off bunch).

    With these features already very close to being finished a year and a half ago and the unfinished nature of this release, this will further tell people to stay away and get off of Ext JS and that saddens me being a > decade user of Ext JS.

    Reply

    • Dawesi says

      Considering the 7.x framework a is in the short term scope, I wouldn’t be releasing new features to 6.x series either, I’d put all my resources bar one on developing the next version and focus on the future, not building on the the mostly-delivered past and undelivered promise of modern (7 years and no complete framework – and for some reason you’re bagging Idera after 6 months?? #unfair)

      Idera are already listening in ways Sencha (past) never did.

      Also if those features were finshed (and put on ice) long before the devs left, then why weren’t they relased by them? (point the gun at them also). Also not all updates where devved by past devs also. That is a partial truth (white lie).. They are also delivering tooling updates we’ve (me and many customers) asked for for years and were ignored due to the ‘team’ overriding customer ‘needs’ (not wants). (I’m super happy)

      Idera have a completely different approach to development and I completely understand why they would have laid off a lot of staff with ‘startup’ pay packets. (we all benefited from being overpaid compared to similar positions)

      They already have a lot of systems in place and have acquired several companies with similar teams. It’s only natural that they consolidate their QA and testing.

      I don’t think any of your assumptions are fair, and come from a long line of hate and defamatory and racist comments about the current team.

      Stay passionate, just dont be so negative and be patient, Idera have a lot of baggage to burn so ExtJS can have the community support it was in v4.x again.

      Anyway off to blog about how crap react is and how we moved back to ExtJS… then again… only egotistical toolbags who don’t ‘really’ care about the people in a community do that (as they really only cared about being worshipped by fanbois), then move on every 2 years and do the same to that community… #jg

      #justchill for a bit… 2019 is going to be a massive year for ExtJS and the sencha ecosystem.

      Reply

      • Mitchell Simoens says

        Tell me one thing I’ve said that is racist?

        Also, why weren’t the features released? Like I have said before, we were preparing a 6.6 release when the acquisition happened. Now year and a half later they are finally getting it out where it was definitely before the end of the year. Oh, and they didn’t finish for the 6.7.0 release, look at how buggy it is.

        Reply

      • Les says

        >>> 2019 is going to be a massive year for ExtJS and the sencha ecosystem.

        I doubt it.

        Ext JS used to be a dominant framework, but it lost a lot of popularity over the past several years. Companies have been moving toward other frameworks. Sencha is not doing much to reverse these trends.

        Reply

      • Mitchell Simoens says

        Yea… so if you call someone racists and don’t back it up then I assume you have no proof to back it up so I’ll take anything you say with a grain of salt (lies).

        Reply

      • Tomas says

        @Dawesi When you run out of real arguments, you just start insulting the other person. Way to go…
        And no, 2019 won’t be ExtJS year (or any other year in foreseeable future).

        Reply

      • Fygo says

        @Dawesi What a bunch of crap. How did you even get to these conclusions (everything beginning with M. Simoens being racist ending with the big year for Sencha).

        This framework is going nowhere, literally nowhere. There is no new devs entering. I doubt too many new companies are looking at the framework and if they are, Sencha/Idera sure as hell must be scaring them away with its passivity and no clear signs of any future. Support is basically non-existent at this point. It was always lacking (much) but now it is terrible. Breaking bugs in a final release… on a viewport? Really? Do you even test, bro? I could go on but what to waste my time for. You know, I gotta write more overrides…

        So big year, yeah… Well, surprise me, it would be really welcome!

        Reply

  9. firefoxSafari says

    It seems Viewports in classic are broken and no longer resize with the browser window. This alone makes the release useless for many. Please fix this ASAP.

    Reply

    • Dawesi says

      the links are in the support portal (where they have always been), and the code is also now in a repo that you access via npm. (as stated in the email)

      Reply

  11. Mark says

    Can you shed some light on which is the main framework going forward? Modern or Classic?

    We were previously told Modern was the way forward we have being starting new projects on Modern. Since the acquisition we find the Modern has hardly moved (in fact gone backwards after the debase off of 6.5.3) and Classic seems to be the favoured framework of choice again.

    Can we get some sort of “official” view of which framework we should be starting new things on?

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

Subscribe to Sencha newsletter

Sencha is committed to protecting and respecting your privacy. For further details on how your data is used and stored, please review Sencha Privacy Policy. You can unsubscribe from these communications at any time.

Sencha.com

US: 1 (800) 212-2802

info@sencha.com