Category: Languages

The programming directory

Method – Add Two numbers

This tutorial is using the same base code as Add two numbers, but with using the function addtwo, this takes two parameters $a and $b which are both set to 0 as the default value and returns the two values added together. The answer part of the web page uses the function to add the two numbers together.

The source code

<?php
       function addtwo($a = 0, $b = 0)
       {
              return ($a + $b);
       }
       $value1 = $_POST['value1'];
       $value2 = $_POST['value2'];
?>
<html>
       <title>PHP - Add two numbers</title>
       <body>
              <form action="addtwonumbers.php" method="post">
                     <input type="text" name="value1" value="0" />
                     <input type="text" name="value2" value="0" />
                     <input type="submit" value="Calculate values"/>
              </form>
              Answer : <?php echo addtwo($value1+$value2); ?>
       </body>
</html>

save as addtwonumbers_function.php, this program will function the same as the previous tutorial apart from the inner working will call the method. The method programming allows for one method to be called multiple times, e.g. Within the example above there could be a method that was 5 lines in length and instead of writing the same 5 lines each time, you just write a method that is called.

Add two numbers

This tutorial will add up two values that have been entered within the web page, I am going to use the web page functional aspects rather than the command line interface because php is mainly used within websites.

The web page itself is using a form tag, this form tag allows for the web page to post data back to the server, where the php will use the posts ($_POST) array ( []).

The source code is

<?php
       $value1 = $_POST['value1'];
       $value2 = $_POST['value2'];
?>
<html>
       <title>PHP - Add two numbers</title>
       <body>
              <form action="addtwonumbers.php" method="post">
                     <input type="text" name="value1" value="0" />
                     <input type="text" name="value2" value="0" />
                     <input type="submit" value="Calculate values"/>
              </form>
              Answer : <?php echo ($value1 + $value2); ?>
       </body>
</html>

if you save that as addtwonumbers.php within the php website configured directory and then open up that page via a web browser (e.g. http://localhost/addtwonumbers.php, localhost means the local pc, just like 127.0.0.1 is the local ring e.g the pc itself to talk to itself via an IP).

Just for completeness, this is the command line interface code.

<?php
 echo "Please enter value 1 : ";
 fscanf(STDIN, "%d\n", $value1); // reads number from STDIN standard input
 echo "Please enter value 2 : ";
 fscanf(STDIN, "%d\n", $value2);
 echo "Answer : " .($value1 + $value2) . "\n";
?>

Read/Write Files

This is a tutorial on how to open and write files with PHP, of course there is always different ways to accomplish the same task within programming languages.

Fopen will open up a file, the secod parameter is who to open the file, r = read, w = write.

$readin = fopen("countrys.txt", "r");

The while loop will set the variable $county equal to a line from the input file, the fscanf will scan a file with the second parameters requirements, the ‘[^\n]’ means anything that is not(^) a return character (\n).

while ($county = fscanf($readin, "%[^\n]")) {

Fwrite will output to the output file handler (the $output created with fopen), with the text in the second parameters

fwrite($output, "insert into country(place) values (\"$county[0]\");\n");

NOTE: the { } are the begin and end of a code structure, e.g. While begin; do something; end;

This is the code

<?php
       $readin = fopen("countrys.txt", "r");
       $output = fopen("sqlcountrys.txt", "w");
 
       while ($county = fscanf($readin, "%[^\n]")) {
              echo $county[0]. "\n";
              fwrite($output, "insert into country(place) values (\"$county[0]\");\n");
       }
       fclose($readin);
       fclose($output);
?>

if you save that as phpreadfile.php. and also create a countrys.txt file with what ever text you like, e.g. United Kingdom

France
Germany
United States etc.

The output of the program (php phpreadfile.php) will display each line that is read from the input file and the output file will have some other text in it, for demonstrating purposes, have done some sql code.

Hello world

This is the hello world for the php tutorial section. PHP is another Object Orientation language, to get php, if you download it from PHP.NET and you are able to use with Apache or with MS Tnternet Information Services IIS.

Once you have php installed, if you save this

<?php
       echo "Hello World!";
?>

as phphelloworld.php within the correct directory for the php engine to use the file.

Once you point your browser to the file e.g.
http://localhost/phphelloworld.php

and the output will be “Hello World!”;

Hope that helps 🙂

How to convert the output format in Javascript

How to convert the output format in Javascript

If you want to format the output in Javascript, you must realize your codes by yourself because there are no related functions in Javascrip. These days, I got a set of functions written in Javascript to realize the data formatting coded by AJAX WebShop (You can dowonload AJAX WebShop in theire official site:link. Version 3 is recommended). They are very helpful.

Find ‘system.js’ in the directory of AJAX WebShop and you will get these functions below:

function FormatFloat(value,mask)
{
       return BasicFormat(value,mask,'FormatNumber')
}
function FormatDate(varDate, bstrFormat, varDestLocale)
{
       return BasicFormat(varDate,bstrFormat,'FormatDate',varDestLocale);
}
function FormatTime(varTime, bstrFormat, varDestLocale)
{
       return BasicFormat(varTime,bstrFormat,'FormatTime',varDestLocale);
}
function BasicFormat(value,mask,action,param)
{
       var xmlDoc;
       var xslDoc;
       var v='<formats><format><value>'+value+'</value><mask>'+mask+'</mask></format></formats>';
       xmlDoc=parseXML(v);
 
       var x; 
       if(isIE)
              x='<xsl:stylesheet xmlns:xsl="uri:xsl">'
       else
              x='<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">';
       x+='<xsl:template match="/">';
       if(isIE) {
              x+='<xsl:eval>'+action+'('+value+',"'+mask+'"';
              if(param)x+=','+param;
              x+=')</xsl:eval>';
       }
       else
              x+='<xsl:value-of select="format-number('+value+',\''+mask+'\')" />';
 
       x+='</xsl:template></xsl:stylesheet>';
       xslDoc=parseXML(x);
       var s;
       if(isIE)
        s= xmlDoc.transformNode(xslDoc)
       else{
              //for mozilla/netscape 
        var processor = new XSLTProcessor(); 
              processor.importStylesheet(xslDoc);
              var result = processor.transformToFragment(xmlDoc, xmlDoc);
        var xmls = new XMLSerializer(); 
        s = xmls.serializeToString(result);
       }
       return s;
}

On mouse events

Within javascript it is able to reference an HTML object so that if any “on” events happen, for example if an mouse hovers over the HTML object it is called onmouseover event and these events are capable of changing the webpage as well.

To create an process attached to an event, you can either add the code inline to the HTML object like

       <a href="/" title="testing" onmouseover="javascript:this.style.background = 'blue'" onmouseout="javascript:this.style.background = 'white'">First Test </a>

This will change the link object <a> events for when the mouse hovers over the <a> HTML object (onmouseover) and also when the mouse leaves the <a> HTML object (onmouseout).

Also with using the body HTML onload event, it is able to attach an javascript process to any object without doing inline code.

       <body onload="javascript:objload('aid');">

which is attached to any function, in this case I have attached to objload(objectID) function.

Here is the full HTML code

<html>
       <head>
              <script language="javascript">
                     /// can do a window.onload function instead of the body onload
                     window.onload = function()
                     {
                            //objload("aid");
                     }
 
                     // function to alter the object with mouse over events
                     function objload(objID)
                     {
                            // obtain the object of the passed in element ID
                            <span style='color:blue'>var</span> obj = document.getElementById(objID);
                            // <span style='color:blue'>for</span> the object mouse over function (e = event)
                            obj.onmouseover = function(e)
                            {
                                   obj.style.background = 'blue';
                                   obj.style.color = 'white'
                                   return true;
                            }
                            // <span style='color:blue'>for</span> the object mouse out function 
                            obj.onmouseout = function(e)
                            {
                                   obj.style.background = 'white';
                                   obj.style.color = 'blue';
                            }
                     }
              </script>
       </head>
       <!-- can do onload event with the standard html -->
       <body onload="javascript:objload('aid');">
              <a href="/" title="testing" onmouseover="javascript:this.style.background = 'blue'" onmouseout="javascript:this.style.background = 'white'">First Test </a>
              <p>
              <a href="/" title="test" id="aid">Second test</a>
</html>

Styles – alter with javascript

To alter style values within a html page via Javascript can be done two different ways, that I know of, one is via getting the object itself and then altering the style from that and the other is via the document style sheets object.

The document style sheets object is all of the styles on the web page and is index within an array manor. For example

       styleSheet = document.styleSheets[<insert number of object>]

But since the two main browsers (Internet Explorer and also Firefox) deal with the css rules within this object with a different reference (IE = rules and FF = cssRules).

       if (styleSheet.cssRules)
              cssRule = styleSheet.cssRules[0]; // Firefox
       else if (styleSheet.rules)
              cssRule = styleSheet.rules[0];         // IE

The other method is via the id of the object, to obtain this just need to use the javascript getElementById function with the document object.

       cssRule = document.getElementById(style)

And then once the object of the style is obtained with both functions can just alter the style of the object with the same code.

       if (cssRule.style.backgroundColor == colour)
              cssRule.style.backgroundColor = colour2;
       else
              cssRule.style.backgroundColor = colour;

Here is the full code

<html>
       <head>
              <style language="text/css">
                     h1 { background-color: lightblue;}
                     #pstyle { background-color : lightblue;}
              </style>       
              <script language="javascript">
                     function alterh1(colour, colour2)
                     {       
                            var styleSheet, cssRule;
                            if (document.styleSheets)
                            {
                                   styleSheet = document.styleSheets[0];
                                   if (styleSheet)
                                   {
                                          if (styleSheet.cssRules)
                                                 cssRule = styleSheet.cssRules[0]; // Firefox
                                          else if (styleSheet.rules)
                                                 cssRule = styleSheet.rules[0];         // IE
                                          if (cssRule)
                                          {
                                                 if (cssRule.style.backgroundColor == colour)
                                                        cssRule.style.backgroundColor = colour2;
                                                 else
                                                        cssRule.style.backgroundColor = colour;
                                          }
                                   }
                            }
                     }
 
                     function alterstyle(style,colour, colour2)
                     {
                            var cssRule;
                            cssRule = document.getElementById(style);
                            if (cssRule)
                            {
                                   if (cssRule.style.backgroundColor == colour)
                                          cssRule.style.backgroundColor = colour2;
                                   else
                                          cssRule.style.backgroundColor = colour;
                            }
                     }
              </script>
 
       </head>
       <body>
              <h1>Change this style</h1>
              <input type="submit" value="click here" onclick="javascript:alterh1('blue', 'lightblue')"/>
 
              <p id="pstyle">
                     HI there
 
              <input type="submit" value="click here" onclick="javascript:alterstyle('pstyle','blue','lightblue')"/>       
       </body>
 
</html>