Issues on upgrading wijmo version

Issues on upgrading wijmo version

Posted by: nilesh_nichal on 31 October 2019, 11:21 pm EST

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 31 October 2019, 11:21 pm EST - Updated 3 October 2022, 9:42 am EST

  Hi,

  We have recently upgraded our wijmo from “5.20172.334” to “5.20192.624-rc” and observing some issues with wijmo grid.

  1. The filter icon doesn’t appear on the grid section. Please find the screenshots.

  image1- grid filter with previous version
  
  image2- grid filter disappears in new version

  2. In some cases, filter icon appears but the css is broken as well as the buttons are not actionable(on click of apply button, nothing happens.)

  image3- filter popup with previous version
  
  image4- filter popup with new version

  Can you let us know what is causing this issues, Are some classes or functions changed with respect to grid.

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 3 November 2019, 2:55 pm EST

  Hi Nilesh,

  Yes, there are many changes between the versions 17v2 and 19v2. For example, if your case:

  1. The filter icon may not be showing because, in the earlier version, the icon was embedded in a

     element and the older version, it is embedded in the element. So, this may be causing an issue in your code.

  2. In the earlier version, all of the filter editor buttons were element, which is changed in the older version. Now, they are created using the element.

  You will need to update your CSS accordingly. Let us know if you face any other issues while upgrading.

  Regards,
  
  Ashwin

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 3 November 2019, 4:54 pm EST

  Hi Ashwin,
  
  Thanks for you quick reply.

  I have missed to mention one point in previous post, on click on apply button we are calling Api to get filtered data. After up-gradation that is also stopped.

  Can you please update on this, it’s critical for us. we are using grid in so many places in our application.

  Thanks,

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 3 November 2019, 9:03 pm EST

  Hi Nilesh,

  The solution depends upon how you have added the click event handler on the apply button. My guess is, you must have used the querySelector method to get the reference to the apply button element and added the event listener. If this is the method, then could you please try updating your code as follows:

  const filter = new wijmo.grid.filter.FlexGridFilter(grid, {
  	filterChanging: function(s, e) {
  		setTimeout(() => {
  			const applyBtn = s.activeEditor.hostElement.querySelector('button[wj-part="btn-apply"]');
  			applyBtn.addEventListener('click', function(e) {
  				console.log('clicked')
  			})
  		})
  	}
  });
  

  Let me know if this helps.

  ~regards

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 5 November 2019, 3:52 pm EST - Updated 3 October 2022, 9:42 am EST

  Hi Ashwin,
  
  Thanks for your reply. We have integrated API call through ServerCollectionView.ts. Hence using ServerCollectionView.ts while applying filter and calling api for the same.
  
  We are using below method for filter

  /**
     * Updates the filter definition based on a known filter provider such as the
     * @see:FlexGridFilter.
     *
     * @param filterProvider Known filter provider, typically an instance of a
     * @see:FlexGridFilter.
     */
    updateFilterDefinition(filterProvider: any) {
      if (
        this.filterOnServer &&
        tryGetModuleWijmoGridFilter() &&
        filterProvider instanceof tryGetModuleWijmoGridFilter().FlexGridFilter
      ) {
        this._pgIdx = 0;
        this.filterDefinition = this._getFilterDefinition(filterProvider);
      }
    }
  

  After Upgradation getting below error. Because its not getting ‘window[‘wijmo’][‘grid’]’. Earlier we used to get it. Please find the screenshots attached,
  
  tryGetModuleWijmoGridFilter() function is returning ‘undefined’

  

  After Upgradation:
  
  

  Before Upgradation:

  

  883×87 4.79 KB

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 6 November 2019, 4:06 pm EST

  Hi Nilesh,

  The issue is arising because, until the 18v3, wijmo exported all of its modules to the window object. But, starting from 19v1, wijmo stopped doing that and only the main wijmo module is available to the window object. You will need to update the ServerCollectionView.ts file so that it uses the imported grid and filter module and not the window one:

  import {
      CollectionView, asString, copy, asBoolean, Event, EventArgs, RequestErrorEventArgs,
      asInt, clamp, PageChangingEventArgs, httpRequest, isString, changeType, DataType,
      isDate
  } from 'wijmo/wijmo';
  
  // optional module import of wijmo.grid.filter
  import * as wjcGrid from 'wijmo/wijmo.grid';
  import * as wjcFilter from 'wijmo/wijmo.grid.filter';
  function tryGetModuleWijmoGridFilter(): typeof wjcFilter {
      let m1, m2;
      return window['wijmo'] && wjcGrid && wjcFilter;
      //return (m1 = window['wijmo']) && (m2 = m1['grid']) && m2['filter'];
  }
  

  You may refer to the sample attached.

  ~regards

  ServerCollectionView.zip

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 12 November 2019, 4:03 am EST - Updated 3 October 2022, 9:42 am EST

  Hi Ashwin,

  I have used attached server collection view and now api is being called while applying filter.
  
  But filtertext is setting empty due to that in api request it does not send the filter parameter.

  After Upgradation:

  

  1366×768 83.9 KB

  Before Upgradation:

  

  1366×768 85.4 KB

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 12 November 2019, 4:51 pm EST

  Hi Nilesh,

  We were able to replicate the issue at our end so we have forwarded a bug report to the dev team with internal tracking id 406309. We will give you an update as soon as we will hear from them.

  ~regards

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 12 November 2019, 5:59 pm EST

  Hi Ashwin,

  This defect is showstopper for our next release, as we have used this component in our core product.

  Due to this issue our earlier functional build is broken, and our delivery at risk. hence we need immediate fix.

  Please understand that we have recently done the upgrade and already spent efforts on upgrading from older Wijmo version to this latest one but this issue has derailed our development work.

  Kindly update about the timeline by when you can provide fix.

  Thanks.

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 12 November 2019, 6:28 pm EST

  Hi Nilesh,

  We are really sorry for the inconvenience caused. I have asked the dev team to provide an ETA on this. In the meantime, could you let us know where and how were you using this property?

  ~regards

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 26 November 2019, 4:16 pm EST

  Hi Nilesh,

  The issue has been fixed in the latest release of wijmo. Could you please verify the same and let us know the result.

  ~regards