Thursday 30 October 2014

Open UI and HI list applets vertical scrolling

If you had chance to work on Open UI, you would have observed a lot of difference in UI level objects like MVG, Query Assistant buttons, list applets etc when compared to HI mode. Well, since the base technology in rendering the UI is changed, the changes are required for technical reasons. One such feature is vertical scroll bar being replaced by horizontal play bar. Let us see why this change is probably made. 

Consider vertical scrolling using normal javascript for a table. We can have a vertical scroll bar in a list applet like this. But for the js scroll to work, the table html should have all the table rows (tr) and columns (td) tags and values which should show when we scroll.

So if I have 100 records with 10 fields each, I should have 1100 html tags (100 rows, 1000 columns). This will make my HTML very big. But the actual problem is, we need to get the field values of 100 records and place them into 1000 columns. You know, 1000 GetFieldValue() functions need to get executed. Consider the joins, MVGs and links, the performance will kill your browser. This rules out the JavaScript scroll bar.

Actually, this is the reason why even in HI mode, we have GotoNextSet, GotoPreviousSet, GotoNext, GotoPrevious methods in vertical scroll bar. These are the same methods we have in Open UI list applets also. So, we query a set of records (generally 10) and place them in UI. If user wants to get more records, user has to click on scroll buttons. 

But the visual difference we observe is the slider is missing in Open UI.




Open UI used JQGrid plugin which is a JQuery based plug-in which has built in methods to access/set/modify the Grid/table elements in the HTML. The horizontal play bar is a feature of JQGrid. So, Oracle used it in Open UI. JQGrid is currently used by many web based technologies. 

The horizontal play bar can be aligned vertically and made to look like vertical scroll bar except without slider. I am going to post the script required to make this change. If we can add a slider to this and make it work, then we can have the same vertical scroll bar as in HI mode. 

Please leave a comment about your thoughts on this.

1 comment:

  1. Thank you for providing good information from Kexlin
    You are in the right place for a perfect solution for any app development company in hyderabad. We are well known for delivering the best quality Mobile Application Development Solutions to our clients.

    ReplyDelete