Creating user interfaces in JavaScript can sometimes lead to a problem, especially when the interface used AJAX to load data from the server. As many actions will be event driven by the user you can find that when a user triggers lots of events all at once the browser will send out lots of AJAX requests all at once. This can easily cause bandwidth issues but can also lead to the user getting confused while they patiently await the browser to settle down and let them get on with things.

There are numerous way to get around this issue, the first being to design programs so that AJAX requests are only issued when the user has clicked on something or when they start typing

The for loop in JavaScript can be used to iterate through all items in an array or properties of an object. This makes looping through any object or array very easy. As in the following example that printing out all items in an array.

var count = '';
var numbers = new Array(3);
numbers[0] = 42;
numbers[1] = 13;
numbers[2] = 73;
for(i in numbers){
  count += numbers[i]+' ';
}
alert(count);

The three main objects to do with a JavaScript are navigator, window and document. Although window is part of navigator and document is part of window. So to print off all information to do with a browser you can do the following. Note that some items in window and document can cause JavaScript to crash in some browsers so some error detection is included here.

Creating a new Draggable object with the script.aculo.us framework is easy. You just create a new instance of the Draggable object with the element id to be made draggable as the first parameter and a set of options as the second.

<div id="dragMe"></div>
<script type="text/javascript">
new Draggable('dragMe',{revert:true});
</script>

The revert option will make the draggable element move back to the position it started from. More options can be added by separating them by commas, so to enable ghosting on the element as well as revert use the following.

new Draggable('dragMe',{revert:true,ghosting:true});

Ghosting means that when the element is dragged a ghost copy of the element moves with the mouse, where the original stays where it is until the mouse is released.

Here is a function to create a group of radio buttons in a HTML form. The three parameters are:

1. $name : The name of the radio group.
2. $options : An associative array of items to be included in the group of radio buttons.
3. $default : The default value of the radio buttons.

function createRadio($name,$options,$default=''){
  $name = htmlentities($name);
  $html = '';
  foreach($options as $value=>$label){
    $value = htmlentities($value);
    $html .= '<input type="radio" ';
    if($value == $default){
      $html .= ' checked="checked" ';
    };
    $html .= ' name="'.$name.'" value="'.$value.'" />'.$label.'<br />'."\n";
  };
  return $html;
}

You can call the function in the following way:

MySQL uses the datatype TINYINT to store boolean values. MySQL stores the value as TINYINT(1) which is the same as a bit so the value is either 0 (false) or 1 (true). Using boolean fields can be very useful, but it can be costly in processing as to change the value you have to query the database, find out the value of the field and then act accordingly.

Here is a simple MySQL query that can be used to toggle the value already present in the TINYINT field without having to do any pre-querying.

UPDATE table SET field = 1 - field

It is very easy to break a program with a simple typo. Instead of typing == when comparing two values you type = and actually assign a variable. This is an easy way to introduce a bug as you will not always notice it until your program doesn't work. There is an easy way of avoiding this.

By using the following syntax:

if(100 == $score){ }

Instead of the usual format:

It is very easy to break a program with a simple typo. Instead of typing == when comparing two values you type = and actually assign a variable. This is an easy way to introduce a bug as you will not always notice it until your program doesn't work. There is an easy way of avoiding this.

By using the following syntax:

if(100 == $score){ }

Instead of the usual format:

Here are a few of the built in JavaScript functions available.

To get the length of a string use the length variable. This returns the number of characters in a string.

var str = 'abcdef';
str.length; // returns 6

The charAt function will return the character at the point specified in the parameter. So to get the first character of a string use:

var str = 'abcdef';
str.charAt(0); // returns a

To get the last character of a string use a combination of charAt and length.

var str = 'abcdef';
str.charAt(str.length - 1); // returns 'f'

To get the position of a character or group of characters in a string use the indexOf function. The function returns -1 if the string is not found.

To include a JavaScript file into a HTML page you can use the script tag with the src parameter pointing towards the source code file. However, there is a subtle difference between the script tag in HTML and XHTML. This is because the language attribute is not supported in XHTML, so if you just copy the code from HTML to XHTML the page won't validate. The solution here is to just leave it out.

For HTML

<script language="JavaScript" type="text/javascript" src="scripts/javascript.js"></script>

For XHTML

<script type="text/javascript" src="scripts/javascript.js"></script>

The type attribute is the mime type of the script, which is always text/javascript. Although there is come discussion about what the mime type is supposed to be, best results are usually obtained by just sticking with text/javascript.

Getting a random row from a MySQL table requires the use of the RAND() function in the ORDER BY clause of the SELECT statement. This will generate a new random number for each row and order them by that new number. In order to get a single row this is combined with the LIMIT clause to limit the result to a single row.

SELECT * FROM theTable ORDER BY RAND() LIMIT 1;

To find if a number is odd or even you can use one of two operators.

The modulo operator (% in PHP) can be used to calculate the remainder of the value divided by 2. This gives a value of 0 for even numbers and a value of 1 for odd numbers. This can be used in an if statement as 0 will equate to false and 1 will equate to true.

$value = 10;
if ($value % 2) {
  echo '$value is odd';
} else {
  echo '$value is even';
}

The second method is to use the & (AND) operator with the number 1. This will perform a bitwise calculation on the number and 1, returning 0 if the number is even and 1 if the number is false. So using the same if statement logic as before we can write.