We Keep Coding

Typo3 jQuery OnClick Events

i need some help for my fresh installed Typo3 Website.
I want to set new Values within my DataBase via jQuery onClick Event.
So i guess i need to make use of this class: TYPO3\CMS\Core\Database\ConnectionPool.
Can someone Guide me how i can make use of this class within JavaScript.
I already tried the following, but i can't get it to work
define(['jquery', 'TYPO3\CMS\Core\Database\ConnectionPool'], function($, conPool) {
if(conPool.foo == 'bar'){
conPool.init();
}
});
Typo3 source
I appreciating any Help. Thanks

Your frontend should not be allowed to communicate directly with the database of your TYPO3 instance.
If you allow it anyone can inspect your javascript and get credentials to access your database - and do anything they like. :(
The correct way is a server request with the data you want to change.
then some PHP can compute the data (verify, adapt, ...) and change the value in the database (as PHP has the local credentials to access the database). Then it's up to you to give a notice in the front end if that operation was successful or not.
Such a server-request could be a complete page request, but a simple AJAX-call would be enough. Though you does not need to rebuild the complete page. From the Return of that AJAX request you can show only a notice about failure or success as a flash-message or similar.

Wordpress: Querying a database from within javascipt / jquery

I have a simple postcode search in my wordpress site. The user enters a postcode, clicks search and the browser directs to a new URL based on the postcode entered.
Presently, I have a large switch statement in the onclick handler of the button, which parses the postcode input in a text box and generates some display text and a URL which I then launch using window.open.
It works OK, but as I add more and more postcodes its bloating the code loaded into the browser and it's all visible in dev console. I'm also limited when it comes to making changes as I'm having to go in and modify the code to implement logic directly in my onclick handler. It's a bit of a mess!
What I would like to achieve is to store all of the relevant information in a mysql database, query the DB when the form button is clicked, and then launch the URL which will be returned by the db query (well, there'll be a bit more logic in the server script than that but ultimately I'll just be returning a URL and some text).
I'm struggling to get my head around how to implement this. It appears the DB queries need to be in PHP on the server and has to be queried asynchronously? I'm getting lost down a rabbit hole of AJAX which I'm struggling to understand!
I'm not looking to asynchronously update content on my page - at the point that we're running code in the onclick handler, we're ready to launch a new page based on the postcode entered. It appears the required solution is a little more complex than I hoped it might be.
Can anybody suggest how I might implement this? Do I have to use PHP & AJAX?
Thanks

Create content which updates asynchronously PHP

I'm trying to create a trading bot with PHP.
I would like to get the value of the currency and update it even without refreshing the page.
In order to do this I should execute this call every 5-10 seconds.
Is that correct?
$summ = $d->getMarketSummary("USDT-BTC");
Is there a way to do this asynchronously? Even if user doesn't reload the whole page.
I've heard of AJAX, but it's Javascript.
Thank you in advance.

You've heard it correctly, you need to do this in JavaScript, with AJAX. There are two parts for this:
1) You need to make an API in PHP, a route that will only respond with the data you want. So a page that when called:
<?php
$summ = $d->getMarketSummary("USDT-BTC");
echo $summ;
?>
And mapped to a url, let's say /data.
2) You need to make a JS in your page that calls that newly created route every-so-often; for that your need to use ajax (xmlhttprequest or Fetch API), and use the setInterval function to call it regularly and update the data in your page accordingly.

If you can't use javascript (AJAX) for this task, your only way is to create a CRON job that fires that PHP script every minute. Unfortunatelly, CRON jobs can't be configured to execute every X seconds, but you can fire it all minutes of the day.

Javascript control page and user view page

Currently I'm working on a project where a user enters a lot of data constantly for a hour long window. I'm looking to have one user control all the data via some control panel and then have a link they can distribute to other users that will allow them to view that data without the ability to edit it.
Right now I'm doing some extremely weird methods. I have an XHR request on the control page that fires whenever a field is finished being edited. From there the data is sent to a php file that converts the data into a simple text file. Then the distributed link file will load that file one time and translate it into the necessary format.
Some potential problems I've run into are it seems odd that I'm sending starting as javascript data then going to a php file then to a text file then translating the data all the way back into javascript data again. Another problem I've come into is I'm not sure of a way to force users to reload the page when a field is edited in the control panel after the user has opened the view page.
Have I totally gone overboard here? What are some better concepts I could employ to accomplish this task?

If i understand what you want to do this is how i will do this:
First the data entry
if you have lot of fields you better use a form wizard, i don't have a particular one in mind right now but there is lot of them just search jQuery Form wizard
Here is an example:
http://i.stack.imgur.com/Luk2b.jpg
The concept of the form wizard is to guide user via multiple page and also validate the data. And click save when and the end.
Then save date in database.
Display content
All you need to do is to create a global separate page to display your content.
Let see something like: http://yourserver.com/view/{id}
where id is the identifier of the particular row in your database.

i'm not sure if i totally understand what u about to do. i'm trying to make your work description shorter here:
want to build a website that one person can edit a single page's content in 1 hour, and others can view the content change in that 1 hour.
if this is what u want to build, here's the module:
teacher: the one who can edit the page
student: the one who can only view the page
server: information center
teacher client edits page -> teacher client sends update data to server -> server saves data -> server sends update notice to student client -> student client receives update notice -> student fetches update data from server
to make this module work well, i suggest try socket instead of http reqeust, just like online games or IMs do.
well, try socket.io

How do you make a link perform an action without reloading a page?

The clearest example of this I could think of is the Reddit Upvote/downvote buttons how when you click the button, the value for upvotes is updated, the upvote button lights up, and the page DOES NOT reload, you just stay exactly where you are on the page.
I am trying to make a feature similar to this and I can totally figure out how to do it with reloading, but I want it to not reload so the user experience isn't disrupted.
Is it possible to do this with php? or would I need to use javascript or something?
The action I would need it to perform would be a basic update query in the database.

This would be done with an Ajax call to your php script. Ajax is designed for these asynchronous updates and/or reloads.
Another way you can do this is with HTML5 WebSockets. You could have the client send a trigger to the server when the user clicks the upvote, and then the server could update and push back the data. It would, however, be a bit overfill for this.

If what you want to do is to contact a server to either send it some state or to retrieve some state from the server (or both), then you would use AJAX with javascript in order to contact the server without reloading the page. You can then also use javascript to update the state of your page after the operation. That is generally what the Reddit page you refer to is doing.
Conceptually, you'd set up your page like this:
Put the link on the page.
With javascript install an event handler so you are notified of a click on the link.
When the link is clicked, your event handler will be called.
Prevent the default behavior of the link so the browser doesn't navigate to a new page.
Then, in the event handler, send your data to the server using AJAX. You will obviously need a URL on your server and server process that can accept and process the data for you and return a value if you need to.
If you need the response from the server, then set up a callback function for when the AJAX call completes (this will be some indeterminate time in the future).
Then, if you need to change the current page in any way (like show one more upvote), then you can modify the current page with javascript to show that new state.
Ajax is easier to use with a library (like jQuery) that contains some ajax support code, but you can certainly implement it in plain javascript too.
Here's one example of ajax with plain javscript. You can find many other examples with Google.
This MDN tutorial on AJAX seems pretty helpful too to show you how it works.

You could use JavaScript to do this. Here's a quick sample:
Vote Up
Simple solution in JavaScript:
var el = document.getElementById("upvoteBtn");
el.addEventListener("click", onVoteClick);
function onVoteClick(e) {
e.preventDefault();
// do something
}
Here's a fiddle.
NOTE: I see you'd be updating the database. In that case, you would have to use AJAX in the onVoteClick function (or use XMLHttpRequest) for this. JavaScript is a client-side programming language and will not be able to communicate to the server without the use of AJAX or XMLHttpRequest. Using the jQuery library, you should be able to write AJAX pretty easy.

It's called AJAX.
With AJAX you can send a request in the background.
The easiest way is to use the jquery libary for this.
You can also output some data as JSON back to the script if you want to take some other actions depending on the result from that query.
A good tutorial is this one.
It also explains how this requests (called: XMLHttpRequest) work.

You need to use Javascript's XMLHttpRequest

You can use AJAX...
It allows you to use JavaScript (client side) to call server side functions. Here's a good example.