The Top 40 Free Ajax & Javascript Code for Web Designers

November 26th, 2008

Ajax has becoming very popular recently, but most designers seem to rehash the same script over and over (you’ll see it in a lot of Wordpress Themes and Plugins). Perhaps we aren’t using ajax technology to its full potential, myself included. The list below is made up of the best FREE scripts available, they are all of the highest quality and more or less easy to configure. Give them a try.
I have tried and tested the top 22, and aim to try the rest, because to be honest they look pretty cool.

JavaScript String Object

November 26th, 2008

Return the length of a string
How to use the length property to find the length of a string.

Style strings
How to style strings.

The indexOf() method
How to use the indexOf() method to return the position of the first occurrence of a specified string value in a string.

The match() method
How to use the match() method to search for a specified string value within a string and return the string value if found

Replace characters in a string - replace()
How to use the replace() method to replace some characters with some other characters in a string.

JavaScript String.format() method.

November 26th, 2008

A while back I worked on a pretty heavy duty JavaScript interface that required, as is typical in any UI, a lot of string manipulation. I became tired of building strings with concatenation, they had a tendency to get unwieldy. I wrote this simple string formatting utility for building strings similiar to C#.

The best way to use it is to put it into an external JavaScript source file and reference it throughout the project.

Although the method has only one defined argument it will accept any number of arguments. If you provide more or less arguments than you define in your string they will not cause an error, they will be ignored.

String.Format() In JavaScript As In C#

November 26th, 2008

This is a cool script that gives the same effect as the C# string formating with multiple parameters. Check it out:

function format(str)

{

  for(i = 1; i < arguments.length; i++)

  {

    str = str.replace(’{’ + (i - 1) + ‘}’, arguments[i]);

  }

  return str;

}

Example: <font color=”#008000?>greeting = format(’Hello {0} & {1} ‘, ‘John’, ‘Jane’);</font>

Strings

November 26th, 2008

On this page I explain what strings are and then give an overview of some useful things you can do with them.

Strings are simply groups of characters, like ‘JavaScript’, ‘Hello world!’, ‘http://www.quirksmode.org’ or even ‘14′.

When you write JavaScripts, you need to know what strings are and how they work. You’ll use them a lot, since most things you can read out (the URL of a page, a style sheet declaration, the value of a form field) are strings.

First I explain the basics of strings. Then I explain the fuzzy line between strings and numbers in JavaScript. If you have programming experience in another language, please read this part carefully.
Finally I give some of the most important methods and properties of strings.

String basics
Let’s review the basics of strings.

Quotes
When you declare and manipulate strings in JavaScript, always write them with single quotes ‘ or double quotes ” around them. This tells the browser that it’s dealing with a string. Don’t mix up your quotes, if you start a string with a single quote and end it with a double quote, JavaScript doesn’t understand what you mean. As a rule, I use single quotes ‘ because I’ve decided to use double quotes for HTML and single quotes for JavaScript. You can of course do this the other way around, but I advise you to make some such rule for yourself.

Let’s introduce our two test strings that we’ll use throughout this page:

var a = ‘Hello world!’;
var b = ‘I am a JavaScript hacker.’
Now we have declared two variables, a and b and put strings in them. Having done this, we can start working with them. But first of all, a problem: suppose I’d written

var b = ‘I’m a JavaScript hacker.’;
This string has a single quote in it, so JavaScript thinks that the string ends, doesn’t understand what comes next and gives error messages. So you need to escape the single quote, telling the browser to treat the quote as a character, and not as a command to end the string. This is done by placing a backslash \ before it:

var b = ‘I\’m a JavaScript hacker.’
Note that you can put double quotes in the string without escaping them. After all, you’ve defined the single quotes as the beginning and end of the string, so

var b = ‘I\’m a JavaScript “hacker”.’
gives no problems. The double quotes are automatically treated as parts of the string, not as commands.

Pre-written functions
Now that you’ve defined the strings, you can start using them. For instance, you can append one string to another, you can take the second to fourth character of b and put them in the middle of string a, you can read out what the twelfth character of a is, how many characters b has, if there’s a ‘q’ in them and many more things.

To do this, you can use some automatic functions that JavaScript assigns to each string. One of them is .length that gives the length of the string. So if you want to get the length of ‘Hello world!’ you can do:

var c = ‘Hello world!’.length;
But above we put this string in the variable a. Thereby you make a a string, so it also has a length and this yields the same result:

var c = a.length;
The important thing is that you can use .length on any string: it’s an automatic feature. You can read out the length of any string, whether JavaScript makes it for you (like location.href or document.title) or you have declared it yourself.
I give a list of common automatical methods and properties below.

Strings and numbers
JavaScript is very relaxed about the difference between strings and numbers. Some programming languages require you to state if a variable is a number or a string before doing anything else with it. Not so in JavaScript. In fact you can even add up numbers and strings:

var c = a + 12;
Some programming languages would shut down in disgust when they encounter this line. After all, a is a string and 12 is a number. JavaScript, however, tries to solve the problem by assuming 12 is also a string. So c becomes

Hello world!12
So if you use + on a string and a number, JavaScript is going to make the number a string for you. Better still, if you need it you can treat numbers as strings or strings as numbers.

Conversely, if you apply mathematics to a string, JavaScript tries to make it a number. If the string cannot be interpreted as a number (because there are letters in it, for instance), JavaScript gives NaN (Not a Number).

Finally, JavaScript makes no reliable difference between integers and floating point variables.

Number to string
toString() does not work in Netscape 2 and Explorer 3.
To convert a number to a string, do:

var c = (16 * 24)/49 + 12;
d = c.toString();
Now you can use all methods of strings on d, while c still contains the number.

INTRODUCTION TO URL ENCODING

November 26th, 2008

Background
URL Encoding is the process of converting string into valid URL format.  Valid URL format means that the URL contains only what is termed “alpha | digit | safe | extra | escape” characters.  You can read more about the what and the whys of these terms on the World Wide Web Consortium site:  http://www.w3.org/Addressing/URL/url-spec.html and http://www.w3.org/International/francois.yergeau.html.  
URL encoding is normally performed to convert data passed via html forms, because such data may contain special character, such as “/”, “.”, “#”, and so on, which could either: a) have special meanings; or b) is not a valid character for an URL; or c) could be altered during transfer.   For instance, the “#” character needs to be encoded because it has a special meaning of that of an html anchor.   The <space> character also needs to be encoded because is not allowed on a valid URL format.   Also, some characters, such as “~” might not transport properly across the internet.

Example
One of the most common encounters with URL Encoding is when dealing with <form>s.  Form methods (GET and POST) perform URL Encoding implicitly.  As an example, click the form below to see the string being URL encoded.

The Key to Understanding JavaScript Quickly

November 26th, 2008

The key to a quick understanding of JavaScript lies in the structure of its objects. JavaScript is an object oriented language. Beyond that, it has many similarities to the C programming language. Variables are declared before use but they are not explicitly typecast. The variable type is normally determined by its use. The ability to do anything in a programming language requires functions supported by the language. JavaScript contains a few functions that are not part of objects. These functions are generally for variable type conversion to a specific type along with support of some dialog boxes. The rest of the functionality of JavaScript is contained in its objects. The objects contain:

Methods (Functions)
Parameters (Data or Other objects) - Describe characteristics of the object
Events - Events are tied to objects
JavaScript has basically three types of objects which are:

Top level objects
Objects that are properties of other objects. (What I call sub objects)
Objects that are not properties of other objects (What I call independent objeects)
        
Products & Suppliers Service Providers A Company by Name THE ENGINEERING WEB All Sites Application Notes Material Properties Part Numbers (Beta) Patents Standards Supplier Web Sites 
 

JavaScript objects do not have the normal class to subclass relationship, but are contained within one another and they do not inherit properties from each other. JavaScript is a tool to allow manipulation of objects that are already created by the computer system such as “navigator” to access browser characteristics.

JavaScript Array Object

November 26th, 2008

The JavaScript Array object is used to store a set of values in a single variable name.

For a complete reference of the properties and methods that can be used with the Array object, go to our Array object reference.

The reference contains a brief description and examples of use for each property and method!

JavaScript Date Object

November 26th, 2008

The JavaScript Date object is used to work with dates and times.

For a complete reference of the properties and methods that can be used with the Date object, go to our Date object reference.

The reference contains a brief description and examples of use for each property and method!

JavaScript String Object

November 26th, 2008

The String object is used to manipulate a stored piece of text.

For a complete reference of the properties and methods that can be used with the String object, go to our String object reference.

The reference contains a brief description and examples of use for each property and method!