jQuery Selector and JS works on local server but not on web server

[Nikki Maier]

Hey all,

I have implemented the following codes for the measurement of the input values in a form field:

The code perfectly works on the local server (the development server devserver) and I assume also on every normal webpage.

I hosted my experiment on the cloudserver Heroku. There the function causes an internal server error. The same happened with the following JS function:

                     window.onload = function() { //do smomething };

The problem seems to be the respective query selector and the JS handler.

Did anyone ever encounteres the same problem? Does anyone have a solution for the problem? Can I try other event handlers?

Many thanks,

[Nikki Maier]

In addition, I have problem with the liveSend() when the app is hosted on heroku. The JS and liveSend() function work perfectly on the local server but cause major issues on Heroku. 

I use the JS functions to generate value regarding the interaction of the partcipant with the browser and store this values using liveSend() and custom data export.

Did anyone encountered the same problems uwing JS, jQuery, liveSend() and custom data export on Heroku?

[Chris @ oTree]

Use your browser’s inspector and console.log() to see what is happening on Heroku. Are there any errors and is your liveSend sending the correct message?

According to Sentry or server logs, what is the full traceback of the server error?

Sent from my phone

On Aug 3, 2021, at 7:28 AM, Nikki Maier <monique...@gmail.com> wrote:

In addition, I have problem with the liveSend() when the app is hosted on heroku. The JS and liveSend() function work perfectly on the local server but cause major issues on Heroku. 

--
You received this message because you are subscribed to the Google Groups "oTree help & discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email to otree+un...@googlegroups.com.
To view this discussion on the web, visit https://groups.google.com/d/msgid/otree/14e7bebd-fc5d-4c59-b49a-0a96f73e9e9cn%40googlegroups.com.

[Nikki Maier]

At first, thank you very much for your help!

First error message (JS functions):

In console.log get the error message: 500 (Internal Server Error) 

In the browser: blank page with "Internal server error"

In the heroku log files I get the following error message:

I am not a experienced programmer but I investigated the cause of the problem and figured out that I have a problem with storing the generated data in the SQL database. I generate the time with the Date.now() function in JS [e.g. 1628004266122] and try to store it an integer form field in the init.py file.

 

 Does this cause the first error in the SQL Database? Is the number to large?

Second error message (liveSend):

In console.log() I get the following message: 

However, I assume that the message is only displayed because I activated the JS function and the page is not fully loaded yet because of a time lag between browser and server?

In the server log files I get:

Here I use Date.now again. And again the main problem seems to be the storage of the generated data.

[Chris @ oTree]

Yes javascript dates are too large for the postgres integer type. This is a common issue:

https://groups.google.com/g/otree/c/4gecQxDO6nk/m/ugHK55mRAAAJ

(It doesn't happen locally because devserver uses SQLite rather than postgres.)

In addition to the solutions i mentioned in the last thread (StringField), you can:

- divide the number by 1000. This has the added benefit of matching Python's time format. 

- if you are interested in reaction times, use performance.now() and store time deltas rather than absolute timestamps

In the future, I would like devserver to warn about this but have not found a satisfactory way to do this yet.

[Chris @ oTree]

Another thread on this: https://groups.google.com/g/otree/c/Bme67rZI7rQ/m/V4lz-80tAAAJ

[Chris @ oTree]

By the way if you divide times by 1000, try using FloatField rather than IntegerField.

On Tuesday, August 3, 2021 at 3:04:45 PM UTC-6 Chris @ oTree wrote:

[Chris @ oTree]

As for the error with liveSend being undefined: liveSend is loaded near the end of the page load. So if you are triggering liveSend on mouseenter on some div, it's possible this happens before the page finished loading. One solution is to attach the handler to the mouseenter inside your document.ready function.

On Tuesday, August 3, 2021 at 10:16:29 AM UTC-6 monique...@gmail.com wrote:

[Nikki Maier]

Thank you very much for your detailed answer! 

There is one thing I am still wondering about. Surprisingly, I get the following server error message when I store the timestamp into a string field:

Therefore, I looks like postgresSQL identifies the timestamp as a numeric string. 

Which is kind of strange because well it is just really strange... and the use of a string field worked perfectly well for other programmers.

Is it possible that this has anything to do with my underlying JS function?

e.g.

[Chris @ oTree]

That error message suggests to me that the postgres column is still of type integer. Did you reset your database after making the change?

[Nikki Maier]

After resetting the database, the string form field works as intended! 

Thank you very much for your help! In addition, I learned quite a lot about SQL and and databases which are quite interesting.