Area units conversion class using JQuery’s AJAX .

Posted: January 5, 2010 in Uncategorized

Hi , today we will code our area system conversion in PHP object-oriented .

Our project will be consisting of three parts :-

  1. The PHP class : for the conversion calculations .
  2. An HTML form to send conversion request to the convertArea.php script .
  3. The script that implements the class .

The PHP class areaConversion.class.php

<?php
/**
 * @author adham
 * @tutorial ‪http://wp.me/pJ1zT-10
 */
class areaConversion {
    private $quantity , $from , $to , $meters ;
    public $result;
    public function __construct($quantity ,$from, $to){
        $this->from = $from;
        $this->to = $to;
        $this->quantity = $quantity;
        $this->meters = $this->toMeters($this->quantity, $this->from);
        switch($this->to){
            case 'yard':
                $this->result = $this->toYards();
                break;
            case 'hectar' :
                $this->result = $this->toHectars();
                break;
            case 'foot' :
                $this->result = $this->toFeet();
            break;
            case 'meter':
                $this->result = $this->meters;
        }
    }
    // converts anything to meters
    private function toMeters( $quantity, $from){

        switch($from){
            case 'yard' :
                $meters = 0.83612736;
                break;
            case 'foot' :
                $meters = 0.09290304;
                break;
            case 'hectar' :
                $meters = 10000;
                break;
            case 'meter' :
                $meters = 1;
                break;
        }

        $result = $quantity*$meters;
        return $result;

    }

    private function toHectars(){
        $result = $this->meters * 0.0001;
        return $result;
    }

     private function toYards(){
        $result = $this->meters * 1.195990;
        return $result;
    }

      private function toFeet(){
        $result = $this->meters * 10.763911;
        return $result;
    }

}
?>

The PHP script convertArea.php

<?php
require 'areaConversion.class.php';
if(strlen($_POST['quantity'])!=0 && isset($_POST['from']) && isset($_POST['to'])){
    $converter = new areaConversion($_POST['quantity'], $_POST['from'],$_POST['to']);
    echo round($converter->result, $_POST['round']);
}else{
    echo "please specify required fields !";
}
?>

The HTML form

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
    $("#convForm").submit(function(){
        $.post('convertArea.php',
        {
            from : $("#fromSelect").val(),
            to : $("#toSelect").val(),
            quantity : $("#quantity").val(),
            round : $("#roundSelect").val()
        }

        ,function(data){
            $("#response").text(data);
        });
        return false;
    });
  });
</script>
<div id="response">

</div>
<form id="convForm">
    <h4>From :</h4>
    <select name ="from" id ="fromSelect">
        <option value ="hectar">Hectar</option>
        <option value ="foot">Foot</option>
        <option value ="yard">Yard</option>
        <option value ="meter">Meter</option>
    </select>
    <h4>To :</h4>
    <select name ="to" id="toSelect">
        <option value ="hectar">Hectar</option>
        <option value ="foot">Foot</option>
        <option value ="yard">Yard</option>
        <option value ="meter">Meter</option>
    </select>
    <h4>Quantity :</h4>
    <input type="text" name="quantity" id="quantity"/>
    <h4>Round to :</h4>
    <select name ="round" id="roundSelect">
        <option value ="5">5</option>
        <option value ="6">6</option>
        <option value ="7">7</option>
    </select>
    <input  id ="submit" type="submit" value="convert" name="submit"/>
    </form>
Comments
  1. […] Excerpt from: Area units conversion class using JQuery's AJAX . […]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s