jquery ajax and php session - php

I have a simple web page that has 3 tabs in my main content area. Once a user clicks on a particular tab, I use jquery and ajax to fetch some data from server and (of course) without reloading everything I change some div below those three tabs.
I use $.post to get data from the server and there are 3 different php files on a server that I call (one for each tab) and get data from.
Is it possible to start a php session when a user clicks on the first tab and save some $_SESSION variables and then use them when a user clicks on the second or third tab so that I know what user clicked on the second or third tab?
Thanks!
Newman

Yes, the sessions are shared across all php scripts. So whatever you save in the first tab will be readable on 2nd and 3rd tab. Keep in mind that
Edit:
Thing to keep in mind here is that the domain should remain the same for all scripts to be able to see the session.

Related

Autosave PHP form

I have a form with multiple tabs. Each tab has various items (textboxes, radio buttons, drop down boxes). I need the content to be saved after 15 seconds idle or when the user clicks on a different tab/item.
Currently I am saving when the user clicks on a button. This is giving the problem that if the user is on tab x and clicks the button, the form is taken back to the first tab.
I would prefer to have the save button on the last tab. When the user is filling in the data in the different tabs, it is automatically being saved. When the user clicks on the last tab, the command button is shown and then upon clicking another save is performed and the user is taken to the main screen with all the records.
Your advice and guidance please :)
Regards,
Babu
I'd say you want to submit each tabs content (form values) using an ajax call in background when another tab is selected. That way you can have the user navigate between tabs without having to reload the whole form. And the values are handed over to some ajax endpoint on your server where they can be stored.
You can do the same for an autosave feature: set a timer, when that triggers you use an ajax call to post the form values in background.
To make your life easy use jquery for the ajax calls and jquery-ui for the tabs.
You dont save the previous tab datas until you save the datas in last tab.. because if user is not willing to save the data after moving to last tab mean.. it is waste of saving previous data and deleting it..
So you can do it in SESSION... (i.e) you store the datas of each tab in session with one session ID as
$session[ID][fieldName1]
$session[ID][fieldName2]
$session[ID][fieldName3]
finally if the user click on that last button tab.. you get the datas from session and save in database USING AJAX and unset the session variables.... unset it if he clicks cancel also.....
You can also use Jquery tabs so that the complete form is on one page and the form can be saved on the last tab (with your button).
This way you don't have to worry about your data being saved until the last tab.

Comment system breaks upon opening a new browser tab

I have sort of design problem with my site. Here's the introduction:
I have a simple, dynamic page which contains a videoplayer and next to it a bunch of videos to play. Under the videoplayer there's a comment section that is powered with jquery form plugin because naturally I don't want the page to refresh and reset the video if someone enters a comment while watching.
So, the page fetches the video ID to play via a $_GET variable and then gets another 10 or so video links based on the ID from MySQL database and plays the first one and lists the rest as links next to the player.
The comment system is simple. It fetches all the comments from MySQL table having the same ID as the video playing and lists them via the jquery form plugin mentioned before. Upon entering a new comment it adds the comment to the table again by targeting the same ID.
Since the ajax form plugin fetches the comments from external PHP files containing the comment showing/adding code - I have to use a $_SESSION variable to pass the info from the main page to those files.
And here's the problem:
Everything works as I expected when a client browses the page normally.. but when he decides to open another video to a new tab - the comment system breaks down.
So what happens is that I pass the video ID from the main page's $_GET variable to a $_SESSION variable and use it to let the external show/add-comments-PHP-files know which comments to show. This works fine when a client is using only one tab but when he opens another video in a new tab the $_SESSION variable of course updates to match the new tab's currently playing video's comments and since this variable is same in both tabs - the original tab now points wrongly to the new tab's comments.
So.. to hopefully clarify a bit:
browser tab 1:
$_SESSION['now_playing'] = video 1
[..client opens another video into a 2nd tab]
browser tab 2:
$_SESSION['now_playing'] = video 2
..and from this point on the tab 1's comments are of course the same
as tab 2's.
Would there be any tricks to start a new session upon a new tab creation or something like that? I'm rather new to all this so there might be obviously silly involved.. any pointers how to get this fixed would be greatly appreciated - even if it's a better way to implement the commenting - adding comments without a page refresh is a must tho.
Regards, kitsu
You are hitting the classic problem that the Session data is controlled by a cookie, and is therefore per browser not per screen.
One approach is to have a hidden field on the screen. When handling the get to create the screen, set this to a unique value, and use that value as a key into the session data.
Then pass the value back with the ajax requests - so each screen's requests are handled with a different part of the session data.

Store different data to each tab

I need store different post data to each tab in a browser. If I open a new instance of the same page, the data aren't shared between both.
My problem:
I'm building a CMS to control my website content. But I will open some instances of the same page (many tabs). So I have a search form to find news that I been created on my CMS. If I open a news item I have a cancel button that back to previous page (the news list).
The problem is that the news list have a pagination and a filter form. So I can, for instance, search by a term like "john doe" and advance to page 5, and open a news item. If I cancel, currently I back to news list without filter and on first page.
My solutions:
Well, I don't want to use the history.back() because I can submit a news form and click on back/cancel button. So, I'll back to the current form, what is wrong.
My second idea is to store a $_SESSION with the $_POST sent to the news list and the back button send me to /news/list/recovery-session, that will recovery the $_POST data from session. But it have a problem: if I open two tabs and make two searchs, I'll have only the last session saved.
Your solutions:
Well, I can work with PHP and JS to make it work. You can suggest a idea of what I can do. I think about work with COOKIES, but I belive that it is shared by domain, and not by tab, what is a problem.
Someone?
Generate a unique id and attach it to the form or some hidden element that will be submitted. Save that unique id in a cookie or session variable. Compare the two at time of submission.
If second tab has generated a new id, the first tab will not evaluate to true.
The main problem is the need to persist the state of what page to return to and also the search term when returning back to the news list page. There are many ways to accomplish this, but one simple method is by encoding this data into your query string.
As an example, assuming your search term is "john doe" and you are on page 5, pass that data along to your news page.
news.php?returnSearchTerm=john+doe&returnPage=5& ....
When the news page is created, you can format your cancel link to send you back to the list page with the correct parameters.
news_list.php?search=john+doe&page=5

Is there a recommended approach to handle saving data in response to within-site navigation without onunload event?

Preamble to scope my question:
I have a web app (or site, this is an internal LAN site) that uses jQuery and AJAX extensively to dynamically load the content section of the UI in the browser. A user navigates the app using a navigation menu. Clicking an item in the navigation menu makes an AJAX call to php, and php then returns the content that is used to populate the central content section.
One of the pages served back by php has a table form, set up like a spreadsheet, that the user enters values into. This table is always kept in sync with data in the database. So, when the table is created, is it populated with the relevant database data. Then when the user makes a change in a "cell", that change immediately is written back to the database so the table and database are always in sync. This approach was take to reassure users that the data they entered has been saved (long story...), and to alleviate them from having to click a save button of some kind.
So, this always in sync idea is great, except that a user can enter a value in a cell, not take focus out of the cell, and then take any number of actions that would cause that last value to be lost: e.g. navigate to another section of the site via the navigation menu, log out of the app, close the browser, etc.
End of preamble, on to the issue:
I initially thought that wasn't a problem, because I would just track what data was "dirty" or not saved, and then in the onunload event I would do a final write to the database. Herein lies the rub: because of my clever (or not so clever, not sure) use of AJAX and dynamically loading the content section, the user never actually leaves the original url, or page, when the above actions are taken, with the exception of closing the browser. Therefore, the onunload event does not fire, and I am back to losing the last data again.
My question, is there a recommended way to handle figuring out if a person is navigating away from a "section" of your app when content is dynamically loaded this way?
I can come up with a solution I think, that involves globals and tracking the currently viewed page, but I thought I would check if there might be a more elegant solution out there, or a change I could make in my design, that would make this work.
Thanks in advance as always!
I wanted to follow up here, just in case anyone was interested. Turns out that my question was unnecessary.
Because I have my code set up to save the entered information in the change event for the input element, and since the change event only fires when the element in question loses focus, then if the user clicks anywhere else in my web app interface, that fires the change event for the input, and the data is saved.
The only exceptions are if they refresh the page, or they close the browser, but both of these events do result in an onunload event, meaning I can bind my save data function to that event and handle those cases.
So everything works as I hoped it would, and my confusion arose from a misunderstanding of when the change event would fire.
AJAX is normally overkill for site navigation. Unless there is a compelling reason to use AJAX , I would just make your navigation menu use good old links instead of AJAX calls.
AJAX is used to keep the user immersed in an application, without seeing the flicker, etc. of a full page refresh. However, if they are planning to navigate to another page, the full page refresh is expected (and therefore desirable).

How to store the value?

I want to make the application like below.
First there is a page with four radio buttons. The user clicks on any of the radio buttons but doesn't save and he goes to another page. Then if he comes back to same page with the radio buttons it shows the selected radio button before he goes to another page.
How can I do it by using jQuery and PHP?
You can either save the value in a database, or in a cookie (with javascript, jquery: settings cookie with jquery
EDIT: As palasso said, you can also use php sessions instead of the cookie, all depends on your need.
For example, the user can change the cookies you created (they are just .txt files) and alter the information within.
In your situation, this dont seem to be a problem (becose the cookie depends on the checkboxes the user clicked).
So, you should go with database storage if:
Need to store the checks for long time;
Need to do complex elaboration on them;
Else, go with cookies/session.
First of all you have to start session in your php script. Then use ajax request on a radio button click storing the selected value in the session.
Sessions and cookies are the easier options. I prefer sessions.
Add a click event to the radio button
When clicked save the selected option into a php session
Each time the page is loaded check if the selected value exists in your session and load it.

Categories