Sometimes, when developing plugins for wordpress, you would want to do something differently based on the client request. Normally, we might be tempted to use PHP SESSION which I don’t think is a good solution. I fall in a similar situation where i was having to display something based on the client request.
So, lets consider a scenario. A user is displayed a page containing a drop-down list. The user has to select a car from the drop-down list. In the beginning, only the drop-down list should be displayed because the user has not yet select anything. But later, when the user select a car, and if he returns to that page, the picture of the car should be displayed. So, the question is, how does the server know that the user has already selected a car or not??
My solution, which I don’t know if it is the best, is to create a cookie of the id of the selected car on the client and to check this cookie on the server.
So, on the client, I should have the following functions:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
<?php
add_action('wp_head', 'my_action_javascript');
function my_action_javascript() {
?>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" >
//function setCookie, getCookie from http://www.w3schools.com/js/js_cookies.asp
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function getCookie(c_name)
{
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
{
x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
x=x.replace(/^\s+|\s+$/g,"");
if (x==c_name)
{
return unescape(y);
}
}
}
function setSelectedId(){
var selected_id=$("#selected_id").val();
setCookie("selected_id",selected_id,1);
return true;
}
</script>
<?php
}
function showCar()
{
?>
<form action="" method="POST" onSubmit="return setSelectedId();">
Choose your Car:
<select id="selected_id">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
<input type="submit" value="Choose" />
</form>
<br/>
<script type="text/JavaScript">$("#selected_id").val(getCookie("selected_id"));</script>
<?php
if (!$_COOKIE['selected_id']){
return "";
}
$id=$_COOKIE['selected_id'];
return getLink($id);
}
?>
|
Description of functions:
setCookie,getCookieonly set a value in the cookie.setSelectedIdis called when the user submit the form. It usessetCookieto insert the selected_id in the cookie- When the request is made, the server check if cookie has been set
(!$_COOKIE['selected_id'])and if yes, it returns a the link based on the id.getLinkis a custom function which you must define based on the action you want to take if the user has selected something
In case you have a solution, be it better or anything, please share it 