HTML5 Forms

July 11, 2024

Forms and their attributes

<form>
All the form elements are placed between this tag

action=”url” – The action attribute points to the URL where the forms information will be submitted<

method=”get” or method=”post”- Forms are sent using either the get or post

Values from the form will be added to the URL specified in the ACTION attribute

GET is used in the following form situations:
– Short forms like search
– When only retrieving data from the server

POST method sends the values as HTTP headers and are used for the following forms:
– Upload forms
– Very long forms
– Forms which contain sensitive data
– When adding or deleting information from a database

If no method is set (POST or GET) the form will default to using the GET method

The <input> element is used to create several types of form controls, the value of the type= attribute will determine what kind is created.

Other form elements and attributes include:

– type=”text” – creates a single line output
– name=” ” – identifies the form control for the server
– mexlength=” ” – used to limit the number of characters on a form
– type=”password” – single line text that blocks the input
– element creates a multiline form, text that is coded between the opening and closing tags will appear in the form box
– type=”radio” – creates radio buttons of which only one can be selected
– value=” ” – indicates the value sent to the server of the selected button
– <selected> – this attribute can be used to have a button selected when the page loads
– type=”checkbox” – allows selection of one or more options
– <select> – creates a drop down list
<option> – used with the select element to create options the user can choose
– size=” ” can be used with select to set how many drop down options can be seen
– <multiple=”multiple”> – allows users the pick more than one drop down option
<input> – element is used to allow file uploads
– type=”file” – creates an upload form, method must be set as POST
– type=”submit” – creates a submit button
– type=”image” – can be used to create an image submit button
– type=”hidden” – hides a form on the page
– <button> – element allows more control over button appearance, combine text and image between opening and closing tags
– <label> – identifies the form and helpful for screen readers
– for=” ” – used alongside LABEL and identifies which form it belongs to and allows users to click text
<fieldset> – use to group related forms, browser will show line around group
<legend> – id’s the form group and appears as a form header
– type=”date” – creates a date selection box
– type=”email” – use for email form and also optimizes for smartphone keyboard
– type=”URL” – used when asking for a URL and HTML5 will validate a url as input
– type=”search” – creates a single line search form
– placeholder=” ” – text written in the placeholder attribute shows up in the text form

<html>
    <head>
        <title>Forms</title>
    </head>
    <body>
        <form action="http://www.example.com/review.php" method="get">
            <fieldset>
                <legend>
                    Your Details:
                </legend>
                <label>
                    Name:
                    <input type="text" name="name" size="30" maxlength="100">
                </label>
                <br />
                <label>
                    Email:
                    <input type="email" name="email" size="30" maxlength="100">
                </label>
                <br />
            </fieldset>
            <br />
            <fieldset>
                <legend>
                    Your Review:
                </legend>
                <p>
                    <label for="hear-about">
                        How did you hear about us?
                    </label>
                    <select name="referrer" id="hear-about">
                        <option value="google">Google</option>
                        <option value="friend">Friend</option>
                        <option value="advert">Advert</option>
                        <option value="other">Other</option>
                    </select>
                </p>
                <p>
                    Would you visit again?
                    <br />
                    <label>
                        <input type="radio" name="rating" value="yes" />
                        Yes
                    </label>
                    <label>
                        <input type="radio" name="rating" value="no" />
                        No
                    </label>
                    <label>
                        <input type="radio" name="rating" value="maybe" />
                        Maybe
                    </label>
                </p>
                <p>
                    <label for="comments">
                        Comments:
                    </label>
                    <br />
                    <textarea rows="4" cols="40" id="comments">
                    </textarea>
                </p>
                <label>
                    <input type="checkbox" name="subscribe" checked="checked" />
                    Sign me up for email updates
                </label>
                <br />
                <input type="submit" value="Submit review" />
            </fieldset>
        </form>
    </body>
</html>

HTML – Tables

June 28, 2024

The following is an example of how to construct a table using the following tags

  • <table>
  • <tr>
  • <td>
  • <th>
  • <theader>
  • <tbody>
  • <tfooter>

Tags have been explained in the comments contained in the code below:

<html>
    <head>
        <title>Tables</title>
    </head>
    <body>
        <!-- <table> used to create a table
            <thead> table headers sit inside this element
                <tr> starts a table row
                <td> contains the cell data
                <th> like td but contains the header
            <tbody> groups the body of the table content
            <tfooter> contains the table footer -->
        <table>
            <thead>
                <tr>
                    <th>Date</th>
                    <th>Income</th>
                    <th>Expemditure</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <th>1st January</th>
                    <td>250</td>
                    <td>36</td>
                </tr>
                <tr>
                    <th>2nd January</th>
                    <td>285</td>
                    <td>48</td>
                </tr>
                <tr>
                    <th>3rd January</th>
                    <td>290</td>
                    <td>50</td>
                </tr>
                <tr>
                    <th>4th January</th>
                    <td>255</td>
                    <td>32</td>
                </tr>
                <tr>
                    <th>5th January</th>
                    <td>315</td>
                    <td>65</td>
                </tr>
                <tr>
                    <th>6th January</th>
                    <td>244</td>
                    <td>36</td>
                </tr>
                <tr>
                    <th>7th January</th>
                    <td>450</td>
                    <td>125</td>
                </tr>
                <tr>
                    <th>31st January</th>
                    <td>129</td>
                    <td>64</td>
                </tr>
            </tbody>
            <tfoot>
                <tr>
                    <td></td>
                    <td>7824</td>
                    <td>1241</td>
                </tr>
            </tfoot>
        </table>
    </body>
</html>
The outcome of the preceding code. Note the footer data is not the actual sum, just an example
The outcome of the example code


The Blog Returns

June 28, 2024

It has been almost 10 years since i last posted on this blog and alot has happened in that time. Websites i’ve created have come and gone. While i do have backups of those, they are no longer available online. What is though, is this blog of mine.

I created this blog to act as a record of my knowledge and also a resource to reference at a later date, and today that is exactly what i will continue to do as i begin my journey in learning HTML, CSS, Javascript, JQuery, Python, PHP and MySQL. There will also be Computer Science topics and Cyber Security topics at some point too.

If you found this blog welcome, it’s good to be back and i can’t wait to share and record my knowledge.


Announcement – Domain Transfer

September 23, 2014

After two years with my domain being hosted at WordPress.com i have come to enjoy and learn alot about WordPress. Due to limited functionality of  Wordpress.com i will be moving both my domain and host over the next couple of days, in order for me to gain more control and adjustments to the Blog. I will still be using WordPress but with alot more configurable options.

See-you guys soon.



Programming Core Elements

August 23, 2014

Let’s continue with the Computer Science course. Remember we are planning to make the computer do the work we want it to do and will eventually script repetitive tasks. This will become very valuable when i begin the Cyber Forensics portion. Though it can be applied to many different applications.

Please keep in mind that these should be used as mere reference, as the notes are written in what you could call “very notated” the use of full structured sentences is rare. If you need more info it can be found at MIT’s OpenCourseware.

Intergrated Developer Environment – IDE

  • Python uses IDLE
  • Specialised Text editor

Objects

  • Python is an “Object” including its code
  • Objects have a type which identify what it is (Two Types)
    • Scaler Type
    • Non-Scaler Type

Different Types

  • Intger – Number eg. 3
  • Float – floating point numbers eg. 4.1, these are not the same as real numbers
  • Boolean – True or False
  • None – NoneType is used for a temporary value
  • String – “This is a string”

Expressions

  • Is the sequence of operands and operators
    • Operands – objects
    • Operators – + – / x

You should remember to use floating point numbers to obtain real division also overloaded operators have a meaning that depend in the type of operands.

TypeErrors is performed by the program running type checking in order to avoid undesired results. It’s also good to know that Python programs can also be reffered to as “scripts”

  • Script – Sequence of commands
  • Variable – Name of an object
  • Assignments – state python binds a name to the object

Python Input State

  • Raw_input – Always expects a string from the user
  • Input – basically don’t use as it’s unavailable in Python 3.0

Straight Line Programs

  • Everything in the application is executed just once

Conditional Statements

  • if / else / elif

Programs are intended to be read not just executed, this helps debugging. This is the reason for indentation even when it’s not required.

Branching Programs

  • Due to the structure of the code in Python using statements. More interesting then straight line. Each command is executed at most once, program execution time is governed by the size of the program.

Looping Construct

  • Turing complete aka iteration provides the ability to execute a statement more then once.

 


Computer Science Intro

August 18, 2014

So along with reading the online book “Learn Python The Hard Way” by Zed A.Shaw i have also been taking a keen interest in the computer science course offered by MIT opencourse ware and also Cyber Forensics, of which i hope to be studying at uni during the first semester of 2015.

So for anyone interested here are some of the notes i have taken. I will also use them for my own reference later on.

Common Terms and types of Computers

Use of this knowledge to provide computational problem solving:

Declarative and Imperative Knowledge

  • Declarative – Statement of Fact
  • Imperative – How to solve problem

Algorithm – Describes how to perform something

So far there is instructions, with a “Flow of Control” and a Termination Condition, at which point the application is said to have converged.

The first computers where known as fixed programme computers. These computers where good at performing a single function. eg. Enigma machine used in WWII is an example of a fixed programme computer.

Then there where Stored Programme Computers, now these are way more useful to more people. They are flexible by design and have the ability to change the programme on demand and also are capable of creating programmes from other programmes.

Programming Language:

  • Is a set of “primitive” instructions/control structures and That’s IT

Common Terms:

  • Syntax – defines the sequences of characters and symbols that make up a “well formed string”
  • Static Semantics – Those ‘well  formed strings’ that have a meaning
  • Semantics –

What Programmes Do When They Fail:

  • Crash – They stop running and also indicate that it has stopped. Properly designed applications do not affect the overall system when they crash.
  • Never Stop – Typically an “infinite loop” aka iteration
  • Finish with the wrong/undesired results

This stuff will come together at the end, because at the end of the day we will want to make the computer do what we want it to.

 

 

 


Great Advice – I’m Talking To You “Know it all”

August 17, 2014

Have you ever come across a fellow IT employee or even other technical minded peers and got that feeling they knew everything and anything that there is to ever know about the IT world ?

Well i have and too often then i would like to admit. There are alot of very skilled IT admins/engineers/programmers etc.. out there and i know for some of them they strive to learn everyday, even if they have been at it for 20years. The IT world is a dynamic one and the pace of it all can be definitely overwhelming at times. There will be those people out there that no matter what, they will make time to help and maintain an open mind to new ideas and solutions, these are the guys you want to work with, work for or have working for you.  Due to the pace of the industry we all specialise in one aspect and learn and learn and learn, as an IT worker i will be reading until the day i retire but most probably until the day i die, all in the name of knowledge.

Then there are those “Know it all’s” and it doesn’t discriminate, young, old,  fresh or experienced. Cause no matter what, nothing you offer is right or good enough, they tend to work alone and strive to take all the credit. They can also be found on forums criticising the OP about his or her’s lack of knowledge in the post and often tearing the technical flaws presented to shreds (probably after googling it first). They often keep their minds locked tight and trying to satisfy them (especially if they are superior or your boss) is like putting a square block in a round hole.  It will just never work. They are the trolls of the IT world i think, i would like to never have to work with such a person but the world is unique and diverse, so hey i like a challenge.

 

So the advice you ask ? well if any of you have read “Learn Python The Hard Way” by Zed A.Shaw you may have spotted this while reading the introduction.

 

Excerpt from “Learn Python Hard Way” Zed A.Shaw

Sometimes people who already know a programming language will read this book and feel I’m insulting them. There is nothing in this book that is intended to be interpreted as condescending, insulting, or belittling. I simply know more about programming than my intended readers. If you think you are smarter than me, then you will feel talked down to and there’s nothing I can do about that because you are not myintended reader.

If you are reading this book and flipping out at every third sentence because you feel I’m insulting your intelligence, then I have three points of advice for you:

  1. Stop reading my book. I didn’t write it for you. I wrote it for people who don’t already know everything.
  2. Empty before you fill. You will have a hard time learning from someone with more knowledge if you already know everything.
  3. Go learn Lisp. I hear people who know everything really like Lisp.

For everyone else who’s here to learn, just read everything as if I’m smiling and I have a mischievous little twinkle in my eye.

Source: http://learnpythonthehardway.org/book/intro.html

 

Now those three dot points, don’t you just think they are wonderful ? Well i do and i just wanted to share.


Python IDLE

July 29, 2014

So MIT has a computer science course up online for free, what better way to learn how to make the computer to do things for me by learning about programming.

I have programmed in the past but it was only for a short period of time and i don’t actually remember too much about it.

The best place to start learning about it all would probably be Python and that’s exactly where the course starts too.

If you want to go start it yourself go here: MiT Computer Science Course

It begins with downloading a python interpreter application IDLE or AKA Integrated Development Environment. It looks alot like a terminal shell programme that you should be familiar with if you are configuring Cisco devices using the IOS.

From here you can directly add Python code, as it will be directly executed from here.

python idle


EIGRP Distance Vector Route Discovery

April 27, 2014

EIGRP’s route discovery process uses a “routing by rumour” approach. Meaning that the routers in an autonomous system heard about their routes from another autonomous system/router, they did not receive the route information first hand.This essentially means the routers heard about the routes by listening to network gossip.

The information collected is stored in the following tables.

  • Neighbour Table
  • Topology Table
  • Router Table

With this EIGRP will calculate the best paths and any redundant links (if available) using the following:

  • Bandwidth
  • Delay
  • Load
  • Reliability

MTU is sometimes reffered to being used but it in fact is not, it is only used for some commands but doesn’t affect the outcome of the formula.