Hi all,

I am converting an existing O4W mobile routine from OIv9.4 to v10.2 and the O4WQualifyEvent stopped responding.

So after the CREATE event, when I click on a checkbox or any other control with a O4WQualifyEvent, except for a pushbutton, nothing happens. The little red turning jQuery thing never comes up. Nothing happens. I put some debug code in the 2nd line of the O4W routine, but after the CREATE event finish, it is never called again, except if you click a pushbutton.

example:

O4WCheckBox('Accept Conditions to Continue' , 0, 'ACCEPTED', 'ACCEPTED', MiniOn)

O4WQualifyEvent('ACCEPTED', 'CHANGED', 'checkbox')

Any ideas? Thanks.

Johan Liebenberg

IOT Engineering

Brisbane

Australia

Hi, Johan!

Mobile page building is tricky - we use jQuery Mobile and it's got its own specific way that pages get built and called. But if you already had this working as an o4w mobile app, and it stopped working when you moved it to 10, maybe we've inadvertently broken something.

I'd suggest the first thing to look at, though, is to see if there's some kind of javascript syntax error that's being generated, and the best way to do that (if you're using a Chrome or Chromium browser) is to go to the three dots menu on the upper right, choose More Tools, then Developers Tools, and then navigate to your mobile page - do you see any errors being thrown in the developers console?

- Bryan Shumsky

Revelation Software, Inc.

Hi Bryan,

Yes I see errors in the browser console for the oldest jQeury mobile available as well as the latest. Initially used the default but then tried to match OIv9.4 jQuery Mobile version.

jQeury 1.45 mobile selected

jQuery 1.2 mobile selected

Thanks

Johan Liebenberg

IOT Engineering

Brisbane

Australia

Hi, Johan. It looks like jQuery Mobile works best with jQuery versions less than 3 - on your O4W configuration page, on the 'mobile' tab, what jQuery are you selecting? Try using a jQuery version 2 (like 2.1.4) as the "jQuery Base Version" on the mobile tab, and see if it behaves better?

Hope that helps,

- Bryan Shumsky

Revelation Software, Inc.

Hi Bryan,

I tried a few variations in between resetting the engine 3x via CALL RTI_KILLCURRENTOENGINE('REVSOFT') which don't always seems to work.

What seems to give best results is Base Version 2.1.4 or 2.2.4. Cannot see any difference.

Mobile version 1.4.5 is the only one that seems to work.

So, this fixed the console errors and the O4WQualifyEvent is working again, but the tables don't work. O4WSetCell always put everything in sel column 1. That means that a table with multiple columns, everything ends up in column 1 on the left margin. O4WSetCell(1,2) end up in column 1 under the contents of O4WSetCell(1,1). Changing the browser width makes no difference.

Any ideas what may cause this?

Thanks.

Johan Liebenberg

IOT Engineering

Brisbane

Australia

Hi, Johan. Glad to hear that changing the "base" version of jQuery did seem to fix the problem, as I'd hoped.

I am not surprised that the ability to reset the oengines via the RTI_KILLCURRENTOENGINE call doesn't always work - it's hard to tell an engine to kill itself…

Re: tables - first off, I'd like to suggest that you'd be better off posting different topic questions under different posts, so it's easier to track. But I think what you're seeing is an intentional design decision from jQuery Mobile (the underlying library that o4w mobile uses). Looking at their discussion of tables:

One of the biggest challenges in responsive web design (RWD) is presenting tabular data. Large tables with lots of columns don't fit on smaller screens and there isn't a simple way to re-format the table content with CSS and media queries for an acceptable presentation. To address this, the framework offers two different options for presenting tables responsively. Each has benefits and tradeoffs, the right choice will depend on the data being presented.

Reflow mode - Re-formats the table columns at narrow widths so each row of data is presented as a formatted block of label/data pairs. This is ideal for tables with product or contact information with more complex or lengthy data formatting that doesn't need comparison across rows of data.

Is that the kind of behaviour you're seeing - the column header shown as the 'label' and the cell shown as the 'value' in a label:value type of presentation?

- Bryan Shumsky

Revelation Software, Inc.

Looking into the table behavior further - O4W, when in mobile mode, will attempt to turn any tables (with fewer than 6 columns) into a mobile "grid" by default. For this to work, though, you MUST also specify column headers in the table. So the following code:

 o4wtablestart("myTable")

          o4wtableheader("col 1")

          o4wtableheader("col 2")

          o4wtableheader("col 3")

          o4wText("1x1")

          o4wsetcell()

          o4wtext("1x2")

          o4wsetcell()

          o4wtext("1x3")

          o4wsetcell("+1")

          o4wText("2x1")

          o4wsetcell()

          o4wtext("2x2")

          o4wsetcell()

          o4wtext("2x3")

          o4wtableend("myTable")

will generate output like:

col 1          1x1

col 2          1x2

col 3          1x3

col 1          2x1

col 2          2x2

col 3          2x3

If you want to disable the 'grid' behavior, and instead use the jQuery Mobile "responsive table" behavior, you can do this by turning off the "turn into a grid" default behavior, and adding the "ui-responsive" class - for example, in the O4WTableStart call:

O4WTableStart("myTable", o4wmobiletableoptions("0"):"ui-responsive")

You'll still need to put the table headers in, and in addition you'll need to mark the first column in each row as a "header" as well so jQuery Mobile will "know" it's special. So, something like this:

O4WSetCell(1,1,"cell1x1",O4WTableCellOptions("","","1"))

would mark the first cell as a "header" (using the html <th>) rather than as a normal "detail" cell (which would use the html <td> markup). You would do this for each of your first column cells.

Having said all that - I'm not certain how well the jQuery Mobile/o4w Mobile responsive table works, so you might be happy enough with the default 'grid' behavior I described first, so give that a go and see if it helps?

- Bryan Shumsky

Revelation Software, Inc.

Thanks Bryan,

Options 1 works, but that will mean a lot of reworking in a very large program.

Options 2 works by just adding these options to the my table start: o4wmobiletableoptions("0"):"ui-responsive"

So now I have this:

O4WTableStart('MyTable', O4WSizeStyle('','100%'):NoBorderStyle:o4wmobiletableoptions("0"):"ui-responsive")

And it is responsive as aspected.

Something must have changed in the jQuery mobile since OIv9.4 as this worked there in reponsive mode without having to do anything. At least that is now sorted.

Thanks :)

Johan Liebenberg

IOT Engineering

Brisbane

Australia

Hi Bryan,

Back on this issue again.

Upgraded the customers system with a brand new clean install of 10.2.1. Then I copied the tables and data from the customers system and full rdk from my development system. All good everything works except for this error again.

So I made sure that the O4W settings are identical between my development system (10.1) and the customers 10.2.1.

Previously this worked on the customers system under 10.1, it still works on my DEV system under 10.1, but now under 10.2.1, it stopped working again.

Clicking on anything does nothing. The Chrome console reports this:

jquery.mobile-1.4.5.js:3089 Uncaught TypeError: Cannot read properties of undefined (reading 'state') at a.mobile.Navigator.popstate (jquery.mobile-1.4.5.js:3089:30) at f (jquery-2.2.4.min.js:2:3698) at dispatch (jquery-2.2.4.min.js:3:7537) at r.handle (jquery-2.2.4.min.js:3:5620) at Object.trigger (jquery-2.2.4.min.js:4:4818) at jquery-2.2.4.min.js:4:5328 at Function.each (jquery-2.2.4.min.js:2:2861) at n.fn.init.each (jquery-2.2.4.min.js:2:845) at n.fn.init.trigger (jquery-2.2.4.min.js:4:5304) at HTMLDocument._load (jquery.address-1.6.js:207:35)

I fisically checked the jQuery mobile files (…\OInsight10\o4w\jquerym\…) between 10.1 and 10.2.1 and they seem the same.

The settings are identical.

Tried all the other combinations of base and mobile versions.

What am I missing?

Johan Liebenberg

IOT Engineering

Brisbane

Australia

Hi, Johan. Sorry to hear this is causing problems again. Can you make a very, very small and focused O4W routine that demonstrates the problem so that I can try to test _exactly_ the code that you're using and see if I see the same thing? Just go ahead and email it to me and I'll give it a go.

Thanks,

- Bryan Shumsky

Revelation Software, Inc.

Hi Bryan,

As the system is now in production and time is of an essence, I decided to try one more thing before following your advice above.

From a backup of the old 10.1 system where this works, I copied all the folders inside the o4w folder without overwritng. Just the folders and the folder contents inside the o4w folder, not the files inside the o4w folder itself.

There were quite a few missing, sorry no way of knowing as Windows Explorer just copies one to the other.

Anyway, after a web service restart everything started working again. Problem sovled.

Best I can now do is give you a copy of what is in my 10.1 o4w folder backup and you can compare that to a 10.2.1 o4w folder.

Thanks :)

Johan Liebenberg

IOT Engineering

Brisbane

Australia

Hi, Johan. Glad to hear that fixed it!

Sure, send me your o4w folder, zipped up, and I'll see if I can spot what might have been added back in by your copy.

- Bryan Shumsky

Revelation Software, Inc.

View this thread on the Works forum...