Javascript caching

[Steve Workings]

I'm wondering about something I observe, but don't know enough or what I might do about it.

First, an observation:

If a user navigates to Page A for the first time during a session, it takes, say, 4 seconds to load the page. User submits record, navigates to previous page (a menu of sorts), then back to Page A again. This time and all subsequent times, it takes just 3 seconds to load the page.

With this observation (roughly described) in hand, let's move to a different page/component and the current problem:

User pokes button that loads a 30-row updateable grid in an AJAX window. Last 5 rows of the grid don't behave well when javascript methods and functions are called in those rows. Close the AJAX window, call it again with another 30 rows (different records mind you) and the last 5 rows behave well with javascript actions in the rows. This part that I'm describing here only occurs on the iPad, occurs a little unpredictably, but more often than not, and is not an issue on wired machines. Yes, iPad connectivity is terrific -- rule that out please.

So, with this latest problem that I cannot seem to resolve, and these observations, I'm wondering if there's some kind of javascript caching going on with our pages and/or AJAX windows. And, if there is, is there a way I can "push" the javascript out there before or during the first load of the page/component to help alleviate some of this behavior?

I don't know if this sounds "out there" or not but this "last 5 rows" problem just doesn't seem to have a solution so I'm stretching a little further than usual to find some way to manage it.

[Jim Coltz]

Re: Javascript caching

It sounds like it might be ios6 on the iPad and its nasty habit of caching POSTs. The short answer for the fix is to add a time stamp to the callback. That way the iPad sees the request as a new request and doesn't use what's in the cache. As far as I know only iOs6 is doing this. Everyone else follows the old rule that says that POSTs don't get cached. I ran into this shortly after iOs6 was released and had to add the timestamps to my ajax callbacks in my calendar app to get it to work correctly on the iPad. Don't you just love this stuff!

[Steve Workings]

Re: Javascript caching

Thanks Jim. But I don't know how to do this.

My description was that the last 5 rows don't respond well. What that means, for instance, is that a dropdown to select a value appears to work, but does not record the value in the table. So, when the grid is submitted (for the first time) any values from that dropdown disappear. A second value that doesn't record is a simple type-in text box. The submitted record is simply blank for those fields. But, rows higher up all have their dropdown and text-box values recorded in the table.

[Jim Coltz]

Re: Javascript caching

OK. I was going on the javascript caching comments. Do you get the same results with Chrome on the iPad? If so you can rule out the POST caching theory as Chrome behaves "normally".

[Steve Workings]

Re: Javascript caching

Thanks Jim. I don't have the problems on my iPad for whatever reason, but many users do, and I can't ask them to install Chrome and try that.

[Clipper87]

Re: Javascript caching

Steve,

Have you defined those JS functions in the component itself or are you using a linked js file? Try & see if any difference.

Or try to see what happens if you link in the JS in the A5w page like this (in the HEAD section) :

<script type="text/javascript" src="Javascript/yourjavascript.js"></script>

Frank

[michaeldarby]

Re: Javascript caching

Hi Steve
Did you find a solution to this? We are having similar problems on iOS6 and have had to revert to Google Chrome temporarily.

[Steve Workings]

Re: Javascript caching

Frank - with the exception of one line of javascript (recently added to try to help this situation), everything is as plain-Alpha as I can get it.

Michael - no, don't have a solution. Odd thing is a few of us using iPad have no problem, but most can reproduce it pretty regularly. Still investigating and cannot ask my users around the world to switch to Chrome on their iPads - just can't do that. Plus, I shouldn't have to.

Summary of Symptoms:

In a grid with 25 records, and a checkbox row column, users are having a hard time getting any of the last 5 rows to check.

I have conditional formatting to indicate that a row is checked -- that conditional formatting does not properly display even when a checkbox in the last five rows is checked.

Each row has two fields for data -- one is a dropdown, the other a type-in textbox. If the row formatting doesn't display properly, users can correctly predict that the value of the dropdown box and the value of the type-in textbox will not be committed to the table on Submit.

Currently using a pre-release build of a few weeks ago, and expect to move to the current pre-release build this Friday evening.

[Clipper87]

Re: Javascript caching

Steve,

Don't know what you mean by plain-Alpha ? You mean the JS is in your component ? Cutting it there & pasting it in a .js file is plain-Alpha too. From there I'd test 2 ways: refer to that .js file in your component as linked javascript OR load it in the a5w page that contains your component by using script tags: <script type="text/javascript" src="Javascript/yourjavascript.js"></script>

Takes only a few minutes to do and you might discover a different behavior especially with solution #2 as the browser directly deals with that script tag.

[Steve Workings]

Re: Javascript caching

Frank - I don't think this is a/the problem.

The grid has these columns:
Checkbox (from the grid properties (has checkbox column)
Animal Name (label)
Trainer (dropdown)
Food_Amt (text box)
Button1
Button2

My point is that the user has a heckuva time getting the checkbox to check. This has been the case for weeks now.

A few days ago, in an attempt to alleviate the problem, I added this to the Animal Name onClick event:

$('{Grid.ComponentName}.V.R{Grid.RowNumber}.__ROWCHECKBOX').click();

It's made no difference.

[Clipper87]

Re: Javascript caching

Steve,

I was referring to your original post:

>>And, if there is, is there a way I can "push" the javascript out there before or during the first load of the page/component to help alleviate some of this behavior?

Unless you try to load the js already in the A5W page with script tags we'll never know...

[Steve Workings]

Re: Javascript caching

I guess I'm missing your point here Frank.

The grid is contained in a dialog2. The dialog2 is launched as an AJAX window from a button. Exactly what are you suggesting I insert as code, and where?

[Clipper87]

Re: Javascript caching

Steve,
You stated that you had "javascript methods and functions" that are called in the rows? I presume you mean JS functions you wrote? If yes then move those out of your component into a .js file and then in the a5w page containing your dialog component in the header section put this: (where yourjavascript.js is the file containing your js functions)

<script type="text/javascript" src="Javascript/yourjavascript.js"></script>

[Steve Workings]

Re: Javascript caching

No, I'm referring to Alpha Five's javascript. I did not write any javascript except the one line shown in a previous message. This is as plain Alpha as I can get it with few embellishments from me.

[Clipper87]

Re: Javascript caching

Ok the try & put this in the A5W page header:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<script type="text/javascript" src="javascript/a5.js"></script>

The first 2 meta tags were recently introduced when you create a NEW a5W page
The 3rd line loads the virtual Alpha5 Javascript library