How to poll on HTML page? - html

Lets assume I want to design a web page with stock ticker. I need my webpage to continuously as for fresh updates for stocks. How to do it ?
From my limited knowledge, AJAX wont be of much help.
What I am looking for is what sort of 'poller' can be used ?

What makes you think AJAX is inappropriate?
You can write a function that dispatches an XMLHttpRequest GET request to the relevant endpoint (let's call it /stocks), and sends the ID of the most recent datum as a query string parameter (e.g., /stocks?later_than={id}).
Your server-side code can return all data later than the ID'd datum.
You can use window.setInterval to call that function at a regular interval, or renew the request in a callback executed when the previous request receives a response.
It sounds like you might be asking about WebSockets. Here is a StackOverflow discussion of the relative merits of AJAX and WebSockets.
Here is another great StackOverflow resource covering different approaches to polling.

Ajax could be a easy and working solution. Only need to make multiple Ajax call to check for stock change.
Design your page with a div container inside. Create a javascript function which will get the stocks via AJAX, display them on the container, wait i.e. one minute and make this function call itself.
Only need to launch this beautiful function when the page load.

Related

Changing the URL string in app.post for express JS

this is my first post and I am trying to get back to technology after a break of few years. Really enjoying coding again and decided to learn the MERN stack first. I went through some tutorials and then started to build a website for my business. Created a few pages here and there and was fairly successful to build most things via express, HTML and CSS, until I hit a situation.
Question.- I have an app.post for my '/ranking' route and in this function I am performing some logic. This app.post is being called from the '/ranking' page when the user hits the "View Profile" button. The idea is to pick up unique ID as the value from the HTML template, pass it onto app.post. Then perform the business logic, which includes finding the unique values of the unique ID from the DB. Once this is done, pass it over to a /profile page with res.render. Now this is all working fine. However, after the res.render("profile") call, even though the website is going correctly to the page that I want it to, the url reads
http://localhost:3000/ranking (This is the page from where the post call made). Instead I want it to read,
http://localhost:3000/profile
If there is a solution for this please do let me know. Also if the answer implies that I haven't understood certain key concepts about express and routing, please pass me in that direction. Thanks in advance.
The URL of the route and the filename you pass to render are entirely independent.
If you want to redirect someone to a different URL, then you need to respond to the request using res.redirect and not res.render.

Form POST vs. AJAX POST

As far as I can see. The form post accepts a document while the ajax post accepts a xhr (I'm guessing this can be set)?
If that is the case, I can't use both in the same situation?
Whare are the differences between these two methods of using POST
You could use both and achieve the same result in terms of functionality, but I encourage you to rely on AJAX (jQuery) for providing a better overall user experience and lessen the load on the server (using php, you can only do what is needed, without the need to provide the full html output once more). Only update what actually changed.
When I was using jQuery and AJAX a few years back, I relied on AJAX to update parts of the UI without having the need to refresh the whole web page. Moreover, I used this to CRUD items in the management area and actually achieved a pretty nice user experience.
You can find more information about the jquery post method at jQuery GET and POST details and usage examples
It only makes sense to use one or the other in a context designed for that type of request. If the server would return a full, displayable resource (most commonly, a HTML document), use a form post so that the browser "redirects" to the result. If the server would return a result that only makes sense as part of an already visible resource, use xhr, parse the result and incorporate it into your page.

Cache-Control:private and AJAX results

I have an HTML page which when loaded triggers some AJAX calls, results of those calls are either stored in hidden text-area (mainly for JSON output) or into div (for ajax calls returning HTML content).
What I'm trying to do is to avoid having to make those AJAX calls when leaving the page and then using the back button.
This actually works for the AJAX output stored in text-area, where in fact after a back data is still stored in those fields without having to re-call those AJAX requests, but for what is directly outputted in a DIV it is not the case, meaning that the request will have to be re-called.
What advice can you give me for managing this?
Thanks
This actually works for the AJAX output stored in text-area, where in fact after a back data is still stored in those fields without having to re-call those AJAX requests, but for what is directly outputted in a DIV it is not the case, meaning that the request will have to be re-called.
Browsers "cache" content of form fields under certain conditions; but they won't "cache" dynamically added HTML elements.
What advice can you give me for managing this?
With an appropriate caching policy making the AJAX request a second time should not be too costly - the browser will figure that he already has this resource in his cache, and it should be available almost immediately, without any delays caused by an extra HTTP request.

Turned Based Game with Servlet

I want to make a turn based game (Something like Checkers) with the help of Servlets and jsp pages.I created a page that has a newGame button that redircet to the gamePage(It redirect the first into a Black.jsp and the other request will be redirected to Red.jsp).
My problem is ,how could I refresh the other jsp automaticaly if one of them changed.
Note:After the change in one of the jsp it redirect the request to servlet and servlet update the changed jsp graphics.but the other jsp stay inactive.I want to make it active.
Thank You
It sounds like what you need is Comet. Here's an overview of how it works.
http://www.ibm.com/developerworks/web/library/wa-cometjava/
Basically, the "other" user's browser will send a request to a servlet to get an update, but that request won't receive receive its response until the current player makes a move. This gets around the problem posed by the fact that, with traditional HTTP, the browser always has to be the one sending the request to the server, it can't be the other way around.
There are some variations on the technique. Now that you know the name, I'm sure you'll be able to find lots of useful information about it.
There's another technology called WebSocket which can also serve this purpose, but it requires additional capability built into the browser and, as of now, probably not all of your users will be using compatible browsers.

How to update mysql fields with Javascript

I don't understand. I have searched all internet forums but found nothing helpful. I am trying to update the numberOfLikes field on my postsTable in MySql when the user clicks on the like button. I know this is done through ajax but I am only familiar with prototype ajax and none internet forums state anything about it.
Here's the flow chart
1. On "seeForums.php" user clicks on the "like" link.
2. The like link has an id that triggers the function which updates numberOfLikes on my postsTable.
Thats it. Thats all I need. But I need it in a prototype ajax format, something like this.
function processLikes()
{
new Ajax.Request(theUrl,
{
contentType:"text/HTML",
onSuccess:updateLikesMySql,
onFailure:error
onException:error,
});
}
Helps are appreciated :)
You can't do this with Javascript alone as it is client side only, you'll need to get a server side language (e.g. PHP) involved as well.
The idea is that you send an AJAX request to your PHP file along with the data that you want to update, and your PHP file will handle inserting values into the database. That PHP file would then print an output (e.g. success or failure) which would be received in your Javascript so you can act accordingly.
You should know that the nature of HTTP (web) makes it Request/Response like.
So your backend code runs on the server,
And javascript and all frontend code run on the client.
Client has no access to your database, So you can't do anything to your database with Javascript.
Best thing you can do is ask your serve with javascript to update the database,
Make a server-side script available at some URL,
Then use ajax to call that URL.
In the server-side script, do the code which updates the database.