What are possible version upgrade risks and side effects

Hello,

Our web form application is currently using licensed Infragistics jQuery Controls 12.1.20121.2059. We are thinking of upgrading to the latest version and would like to ask :

1. We would like to understand the risks associated with such upgrade. What are the chances that there will be unexpected UI behaviors or JS errors from the upgrade? Please provide as much details as possible.

2. Is there a manual / procedure of how to properly upgrade to the latest version?

Thanks,

Sharon

Hi,

Please find answers to your questions below:

1. We would like to understand the risks associated with such upgrade. What are the chances that there will be unexpected UI behaviors or JS errors from the upgrade? Please provide as much details as possible.

There are no major changes in the controls since 12.1, every next release rolls out an updated and improved control, but it shares the same architecture and the same or richer client side object model. Upgrading is also recommended because latest products are tested with latest major browser versions and have an ongoing support and bug fixing policy ( you do not get this with using 12.1)

2. Is there a manual / procedure of how to properly upgrade to the latest version?

If you cannot upgrade your project using Version Upgrade Utility you can upgrade your project manually by following these steps:

1.     Get a copy of your project that you have not modified with Version Utility
2.     Make a backup copy of your project
3.     Replace all old assemblies in the Bin folder with the new
4.     Open your project with Visual Studio and press Ctrl+H (Quick Replace)

– Enter the following Values:

Find what:  .v12.1 Version=12.1.20121.xxxx  This should be your current version of ver.12.1 , you will need to change it.
Replace with:  .v15.1, Version=15.1.20151.1018 (This is the current version)

– Select Entire Solutions to change all existing references in your project
– Click on the “Replace All” button
 
Please note that it is very important to enter the exact versions

5.     Create a new empty project or website and drag any control from ver 11.1. A  new ig_res folder will be generated in the project. Copy this folder to your project if there is such folder then overwrite it.

6.     Remove licenses.licx and App_Licenses.dll the should be located in:

C:\…\YourPoject:\licenses.licx
C:\…\YourPoject:\Bin\App_licenses.dll

7.     Clean and rebuild your project.

Please let me know if you have any questions on the matter. If you need assistance later while upgrading, please do not hesitate to contact us.

Thank you for your detailed information and explanation. 

I went over your steps, I understand all what you wrote but I wanted to ask what about the JS / CSS files? 

let me try to tell you what I am doing (in the sense of upgrading) and tell me if I am on the right track.

1. I've downloaded the new Ignite UI 2015 Vol.1 Complete Bundle (No Installer) 35.6MB

2. Replace all css and js files in my project with the new ones.

questions:

1. As this is client side, I think there is no need to do anything with the "bin" folder, right? 

2. In the zip I see a folder called "typings", I don't have it in my project, should I include it in my project? 

3. What about licences? anything specific I need to do regarding that?

4. Anything else I should be doing besides replacing the CSS and JS files? I know you wrote me the steps but I think it is more valid for maybe MVC type bundles, right?

I've done the upgrade as I said and everything seems to be working normally, functionality and UI appearance.

However, in the js root folder of our project we have infragistics.js which is 12.2.20122.1021 but in the bundle I've just downloaded there is no infragistics.js file in the js root folder and , there are 4 files 

infragistics.core.js
infragistics.dv.js
infragistics.loader.js 
infragistics.lob.js 

any input on that ?

Hi Sharik,

I'm sorry that I've provided steps valid for WebForms project – it's my mistake. Anyway, following what you did ex what you need to do – replace the css and js folders with the fodlers installed from the bundle. You do not need to touch the bin folder. The files in the typings folder provide a TypeScript support, if you do not need to use it, then you do not need to include it in the project too.

infragistics.js is a combined file of the above listed files. Instead you can use the infragistics.core.js and infragistics.lob.js files to get your page running, If you have chart controls on the page you will need to reference also the infragistics.dv.js file.

Another option is to load all required resources using the igLoader – please refer here for details on this:

http://www.igniteui.com/help/using-infragistics-loader

Please let me know if you have questions on that.

Thank you for your prompt reply and information

We have done the upgrade as you suggested. I’ve overwritten all the files from the new bundle and started using infragistics.core.js  and infragistics.lob.js (which I will refer to them as the “new files”) instead of infragistics.js (which I will refer as old file). While doing some sanity testing we are encountering an issue.

I’ve prepared a sample project (zipped), – can be downloaded from the following link 
https://drive.google.com/file/d/0B_wjtlkijYV6c3NjTGs0aTZSaW8/view?usp=sharing

mostly copy paste from the major project with some data masking and instead of getting the data from ajax callback I’ve placed a hard-coded json string also with masked data.

As you will notice in the code (and maybe in the UI) we’ve highly customized the grid.

** when running the project please allow it few seconds till the grid will appear **

 
One of our customization is to hide the “Add new row” UI in the parent and child grid.  Instead we have our own button for add row. In order to see what I mean I have commented out line 1169 $(addrows[i]).hide(); you will see the “Add new row” as the first row at the child grid. – that is what we hide.

After the upgrade, when we started using the “new files” this line (1169) which is simple “hide” operation when we expand the first (or second) parent row – is causing the IE(11) to stuck with “local host is not responding due to a long-running script”. With Chrome it works fine but our entire application is only supported with IE.

When I comment out the new files and use the old file instead (line 17-23 in the aspx page) it works fine with line 1169 uncommented.

scenario summery :

1169 uncommented + infragistics.js   : works fine – the "add new row" is hidden successfully

1169 uncommented + infragistics.core.js and infragistics.lob.js  : getting stuck when expanding parent row. hidding "add new row" is causing issue

1169 commented + infragistics.core.js and infragistics.lob.js  : works fine (not getting stuck) but the "add new row" is not hidden.

we have tried many ways to overcome this issue while infragistics.core.js and infragistics.lob.js  but couldn't reach a working solution.

Any suggestion?

 

Hi Sharik,

Thank you for the sample shared , it is appreciated ! I was able to run it and want to let you know that in all combinations listed:

1169 uncommented + infragistics.js   : works fine – the "add new row" is hidden successfully
1169 uncommented + infragistics.core.js and infragistics.lob.js  : getting stuck when expanding parent row. hidding "add new row" is causing issue
1169 commented + infragistics.core.js and infragistics.lob.js  : works fine (not getting stuck) but the "add new row" is not hidden.

I did not encounter errors with IE11 – after expanding a row the addnewrow is hidden, then clicking on the Add Row displays a row. This is the expected behavior, right ?

I would like to note that the infragistics.js is version 12.1, while the core and lob fiels are 15.1. When using 15.1 I I suggest that you use higher version of jQuery and jQueryUI, at least 1.91.1. Our online samples use the following:

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script&gt; // or 1.10.1
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script&gt;

Please try if changing this will persists the behavior with IE11.

Thank you for your quick response and for checking my side project.

After you mentioned that all 3 combinations worked fine for you, I checked one more thing – Compatibility View mode.

In our organization we need to use Compatibility View mode, otherwise intra-websites will not work well (unexpected behaviours). So just for the expirinemt i disabled Compatibility View and vuala it worked.  I searched online and found this : <meta http-equiv="X-UA-Compatible" content="IE=100" /> 
which I've placed in the aspx page and re-enabled the Compatibility View, and it worked! without upgrading the jquery files, however we did end up upgrading jquery regardless.

So that specific issue is resolved but when I click on "Add Row" button on the bottom it crashes with "operation not supported" something related to the comobo that suppose to be the first column (year+month) in the new row, . see screenshot : https://drive.google.com/file/d/0B_wjtlkijYV6TlhaN1FYS0tJQkk/view?usp=sharing tried to upgrade jquery files as you suggested, didn't help.  can you check if it happens on your end as well?

when I switched back to use the infragistics.js it started to work.
any suggestions?

Hi Sharik,

I investigated the issue and it is caused by the first line in your gridCellBeforeEdit function:

    function gridCellBeforeEdit(evt, ui) {
        $(ui.editor[0]).igCombo("option", "enableClearButton", false);
        switch (ui.columnKey) {

In 15.1 a new igCombo widget has been introduced and this new widget does not provide a setter for the enableClearButton option. You can see this by comparing API's:

enableCLearButton in 12.2

enableCLearButton in 15.1

Instead of trying to set the enableClearButton this way I suggest that you set option at initialization time:

                                columnKey: this.parentcolumns.c1,
                                editorType: "combo",
                                validation: true,
                                required: true,
                                editorOptions: {
                                    dataSource: this.ojson.NewDataSet.c1s,
                                    valueKey: this.parentcolumns.c1,
                                    closeDropDownOnBlur: true,
                                    selectionChanged: checkc1,
                                    enableClearButton: false
                                }

Everything else seems to be working fine. Please let me know if you have other questions.

Hello,

I'm just following up to see if you need any further assistance with this issue. If so please let me know.

thank you for the help.

your solution did solve the issue on the side project but not entirely in the original project.

when we press on Add Row button it adds a new row but completely empty gray surface, without any textboxes or dropdowns. something else maybe causing this.

currently we are not able to recreate the same behaviour in the side project. but we will keep at it and if anything then i'll post my qustion here.

thank you for helping us make a progress in the matter.