how to refresh a particular part of a php page? - javascript

I have a php page which displays the result of a particular solution submitted by the user. The page is displaying an image "running" while the solution is checked in the back end and when the solution checking is finished in the back end the result is stored in the database.Now as the result got stored in the database the same php page which was displaying an image "running" should display the image and result that it got from the database. So, it needs to refresh every time to fetch the result from the database.I have used an iframe for that part of the page and passed the solution id using SESSION to the page which iframe is using and that page is fetching the data from the database. but the problem is that due to refreshing when a different solution(with different solution id) is submitted in another tab of the browser then both the previous and the current tab in the browser shows the current page since the solution id is passed using the SESSION variable. I tried Ajax also but not getting desired result. I want that a particular tab on the browser display the result of the solution which was submitted on that tab only. How can i do this please someone help.I surfed the net but dint got any desired result.

Basically, your problem is, that
you allow the same session in two different browser tabs (or windows), so the session ID is not unique between solutions
you store the solution id in the session, so the session id must be unique between solutions
You can work around your problem by removin either of these two conditions - either do not allow session re-use (bad idea IMHO) or use the solution id rather than the session id in your AJAX call for the iFrame refresh, e.g. as a GET parameter

Related

How to maintain the page state when browser back button is clicked?

I have a page with Client side paggination and Filtration. The page lists around 200-300 prouducts.
The page contains some filters like Category,Manufacturer and Weight.
Clicking upon any of the page number or filter, I am manupulating the page content on client side using Jquery.
Everything is working fine till this step. Now there is a usecase where I am facing problem.
Lets say a user comes to our product listing page and click on some of the filters and gets a list of products.
Now he clicks on a particular product , which redirects him to the product page to view the details of the product.
But now when the user clicks on the back button , the user gets the page with the intial state without any filter selected.
Is there any way user will get the page with the filters previously selected on clicking the back button?
You can use some of the following to store data across multiple pages.
Store data in cookies.
Store data in local storage.
Store data in the session on the server.
Make the data part of your URL (use hash or query string for the filter parameters). Note that changing query string causes page reload.
If using cookies, local storage, or hash, you'll need to add JavaScript code to your page that loads and applies the stored data on page load.
There is a number of ways to do this:
If you are dealing with html5 history and a single-page application, then you are not reloading the page. But based on your question, I assume this is not what you are dealing with.
Store something in the URL. For an example of this, look at the filters on TotalHockey, e.g. http://www.totalhockey.com/Search.aspx?category_2=Sticks%2fComposite%20Sticks&chan_id=1&div_main_desc=Intermediate&category_1=Sticks so when you go backwards, the URL contains the entire state.
Use localstorage, if you have a browser that supports it.
use cookies with the $.cookie API
Store it on the session in the server.
You can store the Search Filter Data in session just after submitting on the filter input and on each ajax request (Loading your product listing), you can check the search filter inputs stored in the session and show the data according to them. If search session is empty then show whole listing.
You can also store the full ajax request URL (if GET method is used) in the session after searching the record and hit that particular URL again after coming back from product detail page.

Passing a variable from one page to the next page

I am developing a Question & Answer website where a user is presented five puzzles on a page and the score is calculated using JavaScript as he attempts the questions on the page. The score is saved in a Javascript variable score. I have a paging system like this:
Now when the user clicks on 3 I want to send the variable score to the next page, where I have require scoreUpdateInDatabase.php on each such page such that the score of previous page is made permanent to the databse and the following PHP script presents him the next 5 questions.
How can I pass that score variable in secure way? I can't use GET because the user will modify it. I am satisfied with POST if this can be used, even though POST data can be modified but I just want minimal security.
P.S. Please do not suggest making AJAX call where in one side I will send score and while returning carries next 5 questions. I don't want to use AJAX to refresh content because it is not SEO friendly.
The simplest solution would be cookie based. Writing the value to a session cookie and the reading it.
You could use jquery cookie. It also gives you the option to require https if desired.
Save it in a session. POST would work equally well in this particular case but my preference would be storing it in the session.
The only secure way to do this is to pass the actual answers to the server using a POST or AJAX, do the calculation of the score also on server side and keep it in a SESSION variable.
More information on sessions in PHP
Try looking into Jquery - You should be able to return the value to the server scripting language (as you listed PHP as a tag, I assume you're using PHP). By using Jquery, you can get the javascript variable to the form BEFORE submitting the form to the next page.
Assuming you have used PHP to generate the form to submit initially rather than create the form in javascript. I would use Jquery - to get this file ( http://jquery.com/ ) and to include("jquery.js"); etc... in your PHP script for it to be used.
I would then convert the javascript variable(s) to a php variable and assign this to a hidden field in the form to be submitted to the next page using a $_POST[] variable.
However It will not be SEO friendly (POST and SESSION is not SEO friendly, but you should use them, continue reading)
We are talking of a game. No-one want that the Search engine index the last page of a game... because everyone can search on google (for example) for the last page of your game without playing.
You have to use ajax or post, but don't let google index every page of your game. It's nonsense.
Only the first page of your game should be indexed.

how a javascript function variable data is passed to another page

i have a code here but i don't know how to pass it to the other page... basically it is inside a function so before the code there is a function but i think there is no need to worry about that what i need is to change the "alert" so some kind of variable where i can grab the value and output it, and also i would like to ask because the data in that function is an array is it correct if i write it like this? var x=new Array($(this).attr('fill')); and if it is correct how will i grab the array data into the other page?
$('text').each(function(){
alert($(this).attr('fill'));
i have a working link here but in this one i still need to change the alert into a variable i can call
It's not entirely clear what you're asking, but to get data from one page to the next, you have the following options:
You can store the data on your server and each page can get the data from the server or have the server put the data into each page when the page is constructed.
You can write the data to HTML5 local storage in the browser and each page (on the same domain) can retrieve the data from HTML5 local storage.
You can write the data to a cookie in the browser and each page (on the same domain) can retrieve the data from the cookie.
You can pass data to the next page via the query string in the URL.
Javascript variables and properties of DOM objects live only for the duration of the current page. When you go to another page, the entire javascript state is thrown away and does not survive on the next page (it is built again from scratch on the next page). This is why you must store the data somewhere and then each page can retrieve the data.

Javascript Stored Variable after page refresh

I'm having a problem relating to storing a variable within Javascript. I have a web monitoring page (I have written the code which works), which refreshes automatically every 5 mins.
If one of the sites I am monitoring goes down, the JS sends an email to the admin, but I only want to send this once.
My logic was to:
Check if a site is down
if variable emailPreviouslySent == 'no'
then send email to admin
write to variable emailPreviouslySent = 'yes'
Page would refresh
Check if a site is down
emailPreviouslySent == 'yes'
email would not be sent again
However I'm finding that the variable is emptied each time the page refreshes.
Is there a way of carrying the variable even though the page is refreshing, or perhaps another way around this?
Thanks for your help.
However I'm finding that the variable is emptied each time the page
refreshes.
You are inside state-less HTTP request. Store your variable in cookie to retain its value even after page refresh but notice that a cookie can be deleted by a user too.
Or as rightly suggested by #Matt Ball, a better approach would be to use HTML5's localStorage feature.

Shall I use javascript for page submission?

I am working on a big site, and in the site there is a search module. Searching is done by using a a lot of user submitted values, so in pagination I must pass all these data to the next page, appending the values to url make the url very big.
Sso how can I solve this issue? I am planning to use a javascript based page submission (POST) with all the values in hidden fields to the next page the read all the values from the next page.
Will it cause any problems? Or should I use database to keep the search criterias?
I would create a server side object, possibly with a database backend which is updated by the different pages.
It is at my opinion the most clear and easy solution. Giving parameters from page to page, either by post or javascript or cookie will work too but it's more of a quirk in my experience.
Also if a search query is so complex that it needs multiple pages to create it, it might be helpfull for the user to have all the data stored on the server so he can change it more easily by switching back and forth between the different pages.
I would store all the search criterias in some kind of session-store on the server when the initial search is being triggered.
For pagination I would retrieve the criterias from the session-store and then just show the appropriate results. Also I would append some kind of key to the pagination links (so this would be the only hidden post-field) under which the search criterieas can be found.
Even though the session is per user, you might have several search windows open within the same session, and you don't want to mess them up with the pagination.
In order to make a reliable search with pagination, we need to do a bit more than normal.
We need to handle the following cases.
Once search is done, user may choose to do browser back and forward. Here, if you are doing form submission on every page, it would be an overload. Also, if user presses browser refresh button, it will unnecessarily warn him that data is being submitted.
Searching on a large database with lots of criteria is costly. Hence, optimization is important.
So you should NOT do the following:
Submit data on every page change
Not store data in cookie. (This is not secure and not even reliable.)
For large database with complex query, cache the result in session.
In case, you need very up-to-date and real-time result, ignore point (3) and try doing partial search for every page.
Thus, for your case, you can do the following:
When user searches first time, make the form POST data to a search page.
This search page will store the search query in session and generate a unique id for it.
Now render the result page. The result page will be passed the search id (generated in point 2) and the page number. Example result.aspx?searchId=5372947645&page=2
The result page will puck up the query from session using the searchId and then provide result based on the page number sent.
Using hidden fields and POST method should be fine too unless you are able to get them on the next page right.
To supplement Sarfraz's answer...
It's not necessary to use Javascript to make a POST.
<form action="destination_url" method="POST">
...
</form>

Categories