To update data when submitted or using AJAX ?

whirlmind · December 5, 2014, 12:40pm

I am a beginner to web applications. I am confused what is “the best way” to accomplish what I am doing and I would appreciate some help in making choices.
I am developing an application (helping a friend) that does something like this.

There will be two buttons on the page (used Bootstrap).
Users may click them randomly.
Whenever they click, random numbers are generated by Javascript. (used jQuery)
User clicks the Submit Button.
His sequence of clicks, time of clicking, duration between clicks and the random numbers generated should be stored in the database.

My questions :

(A) Should I use AJAX to update the database then and there, when the button is clicked ?
Or
(B) Should I keep appending the value to a Javascript array/JSON string/HTML hidden textbox as and when they click and finally update the database on submission ?

Note : I am aware that if I don’t use AJAX and user chooses to move away after a few clicks without hitting the Submit button, all data may be lost. My friend says thats okay if the user wishes to consciously move away.

If I should use Option B, further questions :
B1. Which one should I use : A javascript variable, JSON string or HTML hidden textbox ? (Is it possible to append data to a Javascript array variable ?)

B2.
(i) Should I send the entire JSON string to a MySql stored procedure and let it handle the parsing and inserts ?
Or
(ii) Should I build all the insert statements into a single SQL string and submit it ?
Or
(iii) Should I do the inserts as I loop through the values for each click ?

Any other methods welcome too.

scottlpool2003 · December 5, 2014, 1:01pm

If you don’t need that data as essential data, send it with the form and process it at the end.

Strider64 · December 5, 2014, 1:12pm

Using Ajax, JQuery and PHP would be seamless for the updating would be happening in the background. You can even have graceful degradation if you wanted to, meaning that if the user disables JavaScript the script would still work.

My suggest to you would be to get the PHP portion of it working first, then after that incorporate the Ajax and JQuery into the mix. That’s what I do, it might take a little extra time developing the website; however, the functionality of the website in my opinion will be better.

whirlmind · December 5, 2014, 2:37pm

[member=57087]Strider64[/member] : Thank you for your advice.

[member=62829]scottlpool2003[/member] : Thanks.

send it with the form and process it at the end

In case I go that way, any suggestions for the second portion of my question please ?

B1. Which one should I use : A javascript variable, JSON string or HTML hidden textbox ? (Is it possible to append data to a Javascript array variable ?)
B2.
(i) Should I send the entire JSON string to a MySql stored procedure and let it handle the parsing and inserts ?
Or
(ii) Should I build all the insert statements into a single SQL string and submit it ?
Or
(iii) Should I do the inserts as I loop through the values for each click ?

scottlpool2003 · December 5, 2014, 3:45pm

How big do you envision the end string to be? If it’s large amounts of data, I’d go with Ajax to make sure you collect at least some of the data - depending on what the data is and if it’s useful even if incomplete. Otherwise, send it through in a JSON string and process it at the end.

I’m only mentioning sending it as JSON because it’s more lightweight than many hidden input fields. If something is hidden, usually, it shouldn’t be there in the first place. Also, I’m using JSON more and more these days due to the benefits of Android/iOS cross-compatibility.

Depending on the project, I’ll cache results and use them for web and mobile at the same time and run a check if there’s any new data to be pulled.

whirlmind · December 5, 2014, 6:26pm

[member=62829]scottlpool2003[/member] : Your inputs on JSON.vs.hidden fields makes sense to me.

send it through in a JSON string and process it at the end

I don’t expect data to be much. One would expect the user to click about 25 times (on the maximum) and may be 10 times on the average, collecting the 5 fields I mentioned above, for every click. (Although, the application would itself not impose any restriction on the maximum number of clicks).

The user may be rewarded in a little way for responsible participation, so I don’t expect him to move away without submission.

I don’t think caching would apply in my case.

Thanks again for your time.

To update data when submitted or using AJAX ?

B2. (i) Should I send the entire JSON string to a MySql stored procedure and let it handle the parsing and inserts ? Or (ii) Should I build all the insert statements into a single SQL string and submit it ? Or (iii) Should I do the inserts as I loop through the values for each click ?

B2.
(i) Should I send the entire JSON string to a MySql stored procedure and let it handle the parsing and inserts ?
Or
(ii) Should I build all the insert statements into a single SQL string and submit it ?
Or
(iii) Should I do the inserts as I loop through the values for each click ?