Tuesday, 30 September 2014

Apacha Mod Deflate

 A few notes as to how to use mod deflate in Apache 2.*.

Typical .htaccess vhost configuration.

<IfModule mod_deflate.c>
   SetOutputFilter DEFLATE

   # example of how to compress ONLY html, plain text and xml
   # AddOutputFilterByType DEFLATE text/plain text/html text/xml



   # Don't compress binaries
   SetEnvIfNoCase Request_URI .(?:exe|t?gz|zip|iso|tar|bz2|sit|rar) no-gzip dont-vary



   # Don't compress images
   SetEnvIfNoCase Request_URI .(?:gif|jpe?g|jpg|ico|png)  no-gzip dont-vary



   # Don't compress PDFs
   SetEnvIfNoCase Request_URI .pdf no-gzip dont-vary



   # Don't compress flash files (only relevant if you host your own videos)
   SetEnvIfNoCase Request_URI .flv no-gzip dont-vary



   # Netscape 4.X has some problems
   BrowserMatch ^Mozilla/4 gzip-only-text/html



   # Netscape 4.06-4.08 have some more problems
   BrowserMatch ^Mozilla/4.0[678] no-gzip



   # MSIE masquerades as Netscape, but it is fine
   BrowserMatch \bMSIE !no-gzip !gzip-only-text/html



   # Make sure proxies don't deliver the wrong content
   Header append Vary User-Agent env=!dont-vary



   # Setup custom deflate log
   DeflateFilterNote Input instr
   DeflateFilterNote Output outstr
   DeflateFilterNote Ratio ratio
   LogFormat '"%r" %{outstr}n/%{instr}n %{ratio}n%%' DEFLATE
   CustomLog logs/deflate_log DEFLATE
</IfModule>






Total SEO Services

Wednesday, 17 September 2014

Client side Vs Server side Validation

What is form validation?

This will be first question which will arise in minds of some readers. So the form validation is a process of testing and ensuring that the user has entered required and properly formatted information through the web form and it also guide the user to fill the proper and valid information which is called an Error recovery process.

There are many methods to perform this form validation and error recovery process. So all the methods can be majorly categorized in two,

1) Client side form validation techniques and
2) Server side form validation techniques.

What is Client side form validation?

In client side form validation method, all the input validations and error recovery process is carried out in the user’s browser itself. It can be done using JavaScript, AJAX (Asynchronous JavaScript And XML), VBScript or HTML5 attributes. Client side validation has some advantages and some disadvantages too.

Advantages
1) Validation can occur as the form elements are completed and before the form data is submitted to the server.
2) Functionality does not require any server-side scripting.
3) Enhance the user experience by responding quickly at the user level.
4) Error recovery mechanism is quite simple as it guide the user while filling up the form and ensures the user has filled the required fields with valid data.
5) A client-side input validation check can improve application performance by catching malformed input on the client and, therefore, saving a round-trip to the server.

Disadvantages
1) User can alter or bypass the client side validation easily.
2) Client side validation cannot protect your application from malicious attacks on your server and database.
3) Do not rely on JavaScript to enforce security decisions as it can be disabled in client’s browser.
4) No Security!

What is Server side validation?

In server side validation, the inputs submitted by the user are analyzed and sanitized at server using some scripting language such as PHP, ASP, Perl, etc. And it respond to the user by redirecting him to the new dynamically generated web page.

Advantages
1) No such scripting language is used which can be disabled in the user’s browser.
2) The complete information can be submitted without interruptions of error recovery warnings and messages.
3) Secure!

Disadvantages
1)  Need to validate all form fields in order to limit the number of request-response life-cycles.
2) Server-side processing code needs to re-render the page in order to display the error messages.
3) More response time, therefore poor user experience.

So, which validation technique?

The Web Content Accessibility Guidelines 1.0 state that you should, “ensure that pages are usable when scripts, applets, or other programmatic objects are turned off or not supported.

So you should not rely on the client side form validation only, as it may use the client side scripting which may be disabled  by the user. Many users do so, as it has many reasons. If you want to use the client side validation technique for better user experience, you can. But don’t forget to validate it again on server. The reason is because there is nothing stopping someone re-creating a form from your site, removing the validation, then posting it to your post-back script. Attempting to verify where the form is being posted from doesn’t help either, cos it’s easily spoofed.
However, web developers can utilize the benefits of both server-side and client-side validation and error recovery to ensure that their forms are completed in a usable and accessible manner. To ensure the validity of the information that is submitted, server-side processing should typically be the final mechanism for ensuring that the forms are completed accurately and completely.

Conclusion

As both the validation methods have their own significances, we would like to recommend that you should use both the validation methods to sanitize the data you receive from the web forms.
What you think? Which technique you will use? Mention your opinion by commenting below. And don’t forget to share this post.

Total SEO Services

Friday, 12 September 2014

AJAX driven related drop downs


Today we are going to investigate how  we can make a triple related  drop down of country, county and city using AJAX.

You may have seen this in various registration form.

When you select any country, the next drop down will populated with that country’s counties names.
When we select a county the last drop down will be filled with the cities for the  selected county.

Run the following sql scripts in your favorite sql manger to create the tables in your database.
We recoomend the free Workbench application for use with MySQL server.

/* Create table country */
CREATE TABLE `country` (
  `id` tinyint(4) NOT NULL auto_increment,
  `country` varchar(20) NOT NULL default '',
  PRIMARY KEY  (`id`)
)

/*create table state*/
CREATE TABLE `state` (
  `id` tinyint(4) NOT NULL auto_increment,
  `countryid` tinyint(4) NOT NULL,
  `statename` varchar(40) NOT NULL,
  PRIMARY KEY  (`id`)
)

/* Create table city */
CREATE TABLE `city` (
  `id` tinyint(4) NOT NULL auto_increment,
  `city` varchar(50) default NULL,   `stateid` tinyint(4) default NULL,   `countryid` tinyint(4) NOT NULL,   PRIMARY KEY  (`id`)
)

For testing we need some data, run the three sql scripts below to populate your tables with some data.

/* Inserting records into country table */
INSERT INTO `country` VALUES (1, 'USA');
INSERT INTO `country` VALUES (2, 'Canada');

/* Inserting records into state table */
INSERT INTO `state` VALUES (1, 1, 'New York');
INSERT INTO `state` VALUES (2, 1, 'Los Angeles');
INSERT INTO `state` VALUES (3, 2, 'British Columbia');
INSERT INTO `state` VALUES (4, 2, 'Torentu');

/* Inserting records into city table */

INSERT INTO `city` VALUES (1, 'Los Angales', 2, 1);
INSERT INTO `city` VALUES (2, 'New York', 1, 1);
INSERT INTO `city` VALUES (3, 'Toranto', 4, 2);
INSERT INTO `city` VALUES (4, 'Vancovour', 3, 2);

Now we create a test page called  test.php.Which will produce the example below:

Country :
State :
City :


<form method="post" action="" name="form1">
 <center> 
  <table width="45%"  cellspacing="0" cellpadding="0">
   <tr>
    <td width="75">Country</td>
    <td width="50">:</td>
    <td  width="150">
      <select name="country" onChange="getState(this.value)">
       <option value="">Select Country</option>
<?php while ($row=mysql_fetch_array($result)) { ?>
<option value=<?php echo $row['id']?>><?php echo $row['country']?>
       </option>
<?php } ?>
      </select>
     </td>
    </tr>
    
    <tr style="">
     <td>State</td>
     <td width="50">:</td>
     <td>
<div id="statediv">
      <select name="state" >
     <option>Select State</option>
      </select>
</div>
     </td>
    </tr>
    <tr>

     <td>City</td>

     <td width="50">:</td>

     <td>
     <div id="citydiv">

     <select name="city">

    <option>Select City</option>

     </select>
     </div>
     </td>
    </tr>
   </table>
  </center>
 </form>


In the onChange event of the country drop down we will call the getState() JavaScript function. This function will change or populate the options values of the State drop down, let’s look at the code for the getState() function.

function getState(countryId) { 
var strURL="findState.php?country="+countryId;
var req = getXMLHTTP();
if (req) {
req.onreadystatechange = function() {
if (req.readyState == 4) {
// only if "OK"
if (req.status == 200) {
document.getElementById('statediv').innerHTML=req.responseText;
document.getElementById('citydiv').innerHTML='<select name="city">'+
      '<option>Select City</option>'+'</select>';
} else {
alert("Problem while using XMLHTTP:\n" + req.statusText);
}
}
}
req.open("GET", strURL, true);
req.send(null);
}
}


As you can see in the above example we are passing the countryid to the file findState.php, which populate the options in the drop down of the state which is retrieved with AJAX server side code. Below is the code for findState.php.


 
<?php $country=intval($_GET['country']);

$con = mysql_connect('localhost', 'root', ''); 
if (!$con) {
    die('Could not connect: ' . mysql_error());
}
mysql_select_db('test');
$query="SELECT id,statename FROM state WHERE countryid='$country'";
$result=mysql_query($query);
?>
<select name="state" onchange="getCity(<?php echo $country?>,this.value)">
<option>Select State</option>
<?php while ($row=mysql_fetch_array($result)) { ?>
<option value=<?php echo $row['id']?>><?php echo $row['statename']?></option>
<?php } ?>
</select>


In the above code for the state drop down, the getCity() function is called on each  onChange event passing the countryid and stateid, which will help us retrieve all cities for the now selected country and state.

Now we still need to create the JavaScript code for the  getCity() function.

function getCity(countryId,stateId) {

var strURL="findCity.php?country="+countryId+"&state="+stateId;
var req = getXMLHTTP();
if (req) {
req.onreadystatechange = function() {
if (req.readyState == 4) {
// only if "OK"
if (req.status == 200) {
document.getElementById('citydiv').innerHTML=req.responseText;
} else {
alert("Problem while using XMLHTTP:\n" + req.statusText);
}
}
}
req.open("GET", strURL, true);
req.send(null);
}
}

As you can see in the above JavaScript function, a file findcity.php is called and this PHP file populate the city drop down based on the supplied country and state id.

Now all that is left to do is the creation of the code for findcity.php,

<?php 

$countryId=intval($_GET['country']);

$stateId=intval($_GET['state']);
$con = mysql_connect('localhost', 'root', ''); 
if (!$con) {
    die('Could not connect: ' . mysql_error());
}
mysql_select_db('test');
$query="SELECT id,city FROM city WHERE countryid='$countryId' AND stateid='$stateId'";
$result=mysql_query($query);

?>
<select name="city">
<option>Select City</option>
<?php while($row=mysql_fetch_array($result)) { ?>
<option value=<?php echo $row['id']?>><?php echo $row['city']?></option>
<?php } ?>
</select>

Referenced articles:

http://www.thesoftwareguy.in/multiple-dropdown-with-jquery-ajax-and-php/
http://www.dreamincode.net/forums/topic/321253-postback-in-php-with-jqueryajax-and-json/

Let us hope this was helpful and let me wish you good luck.

Charlie :-)

Total SEO Services