JavaScriptConnect

Convert integer to words

2008-04-16T18:31:00.001+05:30

Javascript write & read cookie

2008-04-16T18:28:00.002+05:30

Write Cookie
if(hours != null)

{
expire = new Date((new Date()).getTime() + hours * 3600000);
expire = "; expires=" + expire.toGMTString();
}

document.cookie = name + "=" + escape(value) + expire;

Read Cookie
var cookieValue = "";

var search = name + "=";

if(document.cookie.length > 0)

{

offset = document.cookie.indexOf(search);

if (offset != -1)

{

offset += search.length;

end = document.cookie.indexOf(";", offset);

if (end == -1) end = document.cookie.length;

cookieValue = unescape(document.cookie.substring(offset, end))

}

}

checked and unchecked all checkbox value

2007-06-15T13:28:00.000+05:30

redirect parent when freame is on

2007-05-17T18:54:00.000+05:30

top.location.href='../member.php'

Maintaining Page Scroll Position

2007-05-13T10:46:00.000+05:30

This is a small example how to maintain scroll position of the page/div during refresh with the help of several lines of javascript code:

< html>
< title>< /title>
< head>
< script language="javascript">

// function saves scroll position
function fScroll(val)
{
var hidScroll = document.getElementById('hidScroll');
hidScroll.value = val.scrollTop;
}

// function moves scroll position to saved value
function fScrollMove(what)
{
var hidScroll = document.getElementById('hidScroll');
document.getElementById(what).scrollTop = hidScroll.value;
}
< /script>
< /head>

< body onload="fScrollMove('div_scroll');" onunload="document.forms(0).submit()";>
< form>
< input type="text" id="hidScroll" name="a">< /br>
< div id="div_scroll" onscroll="fScroll(this);"
style="overflow:auto;height:100px;width:100px;">

.. VERY LONG TEXT GOES HERE

< /div>
< /form>
< /body>
< /html>

The example is supposed to be cross-browser compatible. Enjoy :)

Obtain Browser Capabilities Using Javascript (clientCaps)

2007-05-13T10:45:00.000+05:30

The ideal way to obtain client browser capabilities information is from a client-side script. This method minimizes server round trips, frees up server resources, and, consequently, boosts performance. It also provides information about browser settings and user preferences that cannot be obtained in any other way. Code snippet below demonstrates how to obtain browser capabilities using javascript. Specifically - how to obtain connection type (cables, dial-up, ADSL) in Internet Explorer.

< html>
< head>
< script>
function my()
{
var sVersion = oClientCaps.connectionType;
myText.innerHTML = "You are using " + sVersion;
}
< /script>
< /head>

< body style="behavior:url(#default#clientCaps)" id="oClientCaps" onLoad="my();">
< div id="myText">< /div>
< /body>
< /html>

Convert RGB Color to HTML Hex

2007-05-13T10:44:00.002+05:30

HTML needs the RGB (Red, Green, Blue) values of color converted to Hex. Hex is basically just a compact way for a computer to store 16 different values in 1 character. When you use color on Web pages, you often have to take a color code that was generated in one program and convert it into the corresponding Hex value for a Web page. The small javascript function below demonstrates how to convert RGB values to hex string.

function RGB2HTML(red, green, blue)
{
var decColor = red + 256 * green + 65536 * blue;
return decColor.toString(16);
}

Adjust iframe Size to Fit its Contents

2007-05-13T10:44:00.001+05:30

Sometimes we put iframe on HTML page and we need to adjust iframe size to fit its contents (iframe source HTML can be very big) ... Below is a small example that demonstrates how to do it:

< html>
< head>
< title>< /title>
< /head>

< body>
< iframe id="ifr" src="ifr.html">< /iframe>< br />
< input type="button" onclick="document.getElementById('ifr').style.height =
ifr.document.body.scrollHeight + 5" value="Ajust" />

< /body>
< /html>

HowTo Delete Cookie Using Javascript

2007-05-13T10:43:00.001+05:30

Usually server-side code on dynamic web pages is responsible to manage client cookies (store and delete them). However it is also possible to provide a certain control for cookie management from client code. This is a small javascript trick that demonstrates how to delete cookie using client code. Cookie simply is updated as expired and removed.

< html>
< head>
< title>< /title>
< script language="Javascript">

function loaded()
{
document.cookie = "v0=1;";
document.cookie = "v1=2;";

alert(document.cookie);
}

function deletecook()
{
var d = new Date();
document.cookie = "v0=1;expires=" + d.toGMTString() + ";" + ";";

alert(document.cookie);
}

< /script>
< /head>

< body onload="loaded();">
< a href="javascript:deletecook();">delete cookie< /a>
< /body>
< /html>

How to Close Browser Window (window.close()) Without Warning

2007-05-13T10:42:00.002+05:30

How To Change Browser Scrollbars Colors

2007-05-13T10:42:00.001+05:30

Small javascript code snippet that demonstrates how to change browser scrollbars colors. Please pay attention to the correct scroll colors attributes names (so they can be accessed using javascript). Usually javascript naming standard is "camel-case".

with(document.body.style)
{
scrollbarDarkShadowColor = "0000FF";
scrollbar3dLightColor = "87CEFA";
scrollbarArrowColor = "0084ff";
scrollbarBaseColor = "0000FF";
scrollbarFaceColor = "000020";
scrollbarHighlightColor = "0000FF";
scrollbarShadowColor = "0000FF";
scrollbarTrackColor = "00008b";
}

Remove Upper Chars from String

2007-05-13T10:41:00.001+05:30

Function in javascript that uses toUpperCase and removes all upper chars from the input string.

function fRemoveUpperChars(src)
{
var dst = "";
var c = "";

for (var i = 0; i < src.length; i++)
{
c = src.charAt(i);
if (c != c.toUpperCase())
{
dst += c;
}
}

return dst;
}

Javascript Tip: Catch Browser Closing Event

2007-05-13T10:40:00.001+05:30

Occasionally there is a need to catch browser closing event. The most elegant way to catch browsing closing event in IE is the following short script:

< html>
< head>
< title>< /title>
< /head>

< body onunload = "if (screenTop > 9999) alert('Closing');">

< /body>
< /html>

From which it is obvious what is usually happening to the closed windows. Enjoy :)

Javascript: How To Set Cursor to Textbox End

2007-05-13T10:39:00.000+05:30

In order to set up a cursor to the end of the text box there are 2 choices:

* Use createTextRange method.
* Focus the field and then set value. <--

"The trick is to set the value of the element after setting the cursor. The cursor will then be moved with it as the new value is written and end up at the end..."

< html>
< head>
< title>< /title>
< script language="javascript">
function func()
{
var t2 = document.getElementById("t2");
t2.focus();
t2.value = t2.value;
}
< /script>
< /head>

< body>
< input type="text" id="t1" value="aa">
< br />
< input type="text" id="t2" value="bb">
< br />
< input type="button" id="b" value="Run" onclick="func();" />
< /body>
< /html>

Javascript: Open Pop-Up at Center of Client Window

2007-05-13T10:38:00.000+05:30

In javascript - window.open opens a pop-up that by default opens at random location of the window. Below is a javascript function that will open a pop-up in the center of the client window. Hope it may save many additional lines of javascript code.

function windowOpener(windowHeight, windowWidth, windowName, windowUri)
{
var centerWidth = (window.screen.width - windowWidth) / 2;
var centerHeight = (window.screen.height - windowHeight) / 2;

newWindow = window.open(windowUri, windowName, 'resizable=0,width=' + windowWidth +
',height=' + windowHeight +
',left=' + centerWidth +
',top=' + centerHeight);

newWindow.focus();
return newWindow.name;
}

Please notice parameters that are passed to window.open.

Create Random Numbers & Characters

2007-05-13T10:36:00.001+05:30

function randomString() {
var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
var string_length = 8;
var randomstring = '';
for (var i=0; i < string_length; i++) {
var rnum = Math.floor(Math.random() * chars.length);
randomstring += chars.substring(rnum,rnum+1);
}
document.randform.randomfield.value = randomstring;
}

Display a Random Image

2007-05-13T10:35:00.002+05:30

Count Words Using JavaScript

2007-05-13T10:35:00.001+05:30

To use this script, place the following code in the document head:

function countWords(){
document.form1.wordcount.value = document.form1.inputString.value.split(' ').length;
}

Place the following code in the document body:

You can adapt this script to count words is whichever way you like. The important part is inputString.value.split(' ').length — this counts the spaces.

Add Text to a Textarea or Text Field

2007-05-13T10:34:00.001+05:30

This page shows you to how to add (append) or replace text in a text area or text field. In the example below, the new text is entered in the left text area and added to the one on the right. We will also look at other options for acquiring the new text.

Step 1 - Create Text Area(s)

Use the following code to create the form and text areas. Modify the layout and names to suit your needs (but remember to change the function code as well if you do).

Step 2 - Create Function

Insert the following code into the page head:

function addtext() {
var newtext = document.myform.inputtext.value;
if (document.myform.placement[1].checked) {
document.myform.outputtext.value = "";
}
document.myform.outputtext.value += newtext;
}

More Options

To acquire the new text from something other than a text field, modify the newtext variable. For example:

// Pre-defined text:
var newtext = "This is the new text";
// Drop-Menu:
var newtext = myform.mymenu.options[myform.mymenu.selectedIndex].value;
// Prompt:
var newtext = prompt('Enter New Text Here:', '');

If you don't need to ask the user whether to replace or append the text, use the following simplified function:

function addtext() {
var newtext = document.myform.inputtext.value;
document.myform.outputtext.value += newtext;
}

This example appends the new text to the existing text. To replace the existing text instead, remove the "+" sign.

Disable the Return Key

2007-05-13T10:33:00.002+05:30

function stopRKey(evt) {
var evt = (evt) ? evt : ((event) ? event : null);
var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
if ((evt.keyCode == 13) && (node.type=="text")) { return false; }
}
document.onkeypress = stopRKey;

How to Make a Search Form With Multiple Search Options

2007-05-13T10:33:00.001+05:30

This page explains how to create a form like the one below, allowing the user to select which search engine they would like to use to perform a search.

This method takes advantage of the query string used by most search engines. The query string is the part of the URL which normally comes after the question mark when a search is performed. For example, if you do a Google search for "Darth Vader", you will notice the URL in the address bar changes to something like:
http://www.google.com/search?q=darth+vader
There will probably be a bunch of other stuff as well, but this is the important part.

The multi-choice search form works by taking the users' search terms and appending them to the URL of the selected search engine.

Step 1 - List of Search Engine URLs

First of all you need to decide which search engines to include. You can only use search engines which use query strings, so you must check each search engine to make sure they do this. It's not hard -all you have to do is perform a search and see what happens to the URL. If your search terms show up in the URL then you can use this search engine.

Next, find out exactly how the query string is structured for each search engine. Perform a search, then copy the entire URL up to the point where the search terms appear. You will end up with a list looking something like this:

http://www.google.com/search?q=
http://www.altavista.com/web/results?q=
http://www.dogpile.com/info.dogpl/search/web/
http://search.yahoo.com/search?p=

Step 2 - Search Form

The code below makes up the search form. Copy this into your web page and insert the search URLs from your list as the option values, one search engine for each option.

Step 3 - JavaScript Function

And finally, place the following javascript in the head of the page:

function dosearch() {
var sf=document.searchform;
var submitto = sf.sengines.options[sf.sengines.selectedIndex].value + escape(sf.searchterms.value);
window.location.href = submitto;
return false;

Note: To make the search results page open in a new window, replace the line
window.location.href = submitto;
with:
window.open(submitto);

Remove Spaces From a Text Field

2007-05-13T10:32:00.001+05:30

This page shows you how to remove spaces from a text field. Any spaces entered by the user will be removed when they click anywhere outside the text field.

function removeSpaces(string) {
var tstring = "";
string = '' + string;
splitstring = string.split(" ");
for(i = 0; i < splitstring.length; i++)
tstring += splitstring[i];
return tstring;
}

"Add to Favourites" Link

2007-05-13T10:31:00.002+05:30

"Add to Favourites" Link

Note: This option only works in Internet Explorer.

To create a link which adds a specified page to the user's bookmarks, use the following code (change the URL and description to suit your needs)

javascript:window.external.AddFavorite('http://phpconnect.blogspot.com','phpconnect')"

Print Page

2007-05-13T10:31:00.001+05:30

window.print()

Reload Page

2007-05-13T10:29:00.000+05:30

onClick="window.location.reload()" Reload Page

Make Your Web Page the User's Home Page

2007-05-13T10:28:00.000+05:30

onClick="this.style.behavior='url(#default#homepage)';
this.setHomePage('http://phpconnect.blogspot.com');">

How can we submit a form without a submit button?

2007-05-13T10:27:00.002+05:30

document.form.submit()

Slide Show Script

2007-05-13T10:27:00.001+05:30

script>
var i = 0;
gallery = Array();
gallery[0] = "http://www.hibot.com/images/interesting/asiankid/mrbean.jpg";
gallery[1] = "http://www.hibot.com/images/interesting/asiankid/shrek.jpg";
gallery[2] = "http://www.hibot.com/images/interesting/asiankid/titanic.jpg";
function nextImg() {
i = (i < (gallery.length-1)) ? i+1 : 0;
document.galleryImage.src = gallery[i];
}
/script>

a href=javascript: onClick="nextImg()">/a>

Pause and Display

2007-05-13T10:26:00.002+05:30

They use a timer, nothing fancy. Just view the source of the "search in
progress" page and you'll note both the meta tag and a script to redirect
after 4 seconds.

META HTTP-EQUIV=Refresh CONTENT="4;
URL=http://hotscripts. com/search/ 13979793. html">

link href="http://hotscripts. com/style. css" rel="stylesheet" type="text/css" >
script>

script>

validate email address using javascript

2007-05-13T10:26:00.001+05:30

validate url using javascript

2007-05-13T10:25:00.002+05:30

checkbox validate

2007-05-13T10:25:00.001+05:30

document.emailForm.agree.checked

go back using javascript

2007-05-13T10:24:00.002+05:30

history.back();

limit textbox in javascript

2007-05-13T10:24:00.001+05:30

function checkInput(data,obj,max){
var result = true;
if (obj.value.length >= max){
var stripped = obj.value.substring(0, max);
document.getElementById(data).value = stripped;
result = false;
}
if (window.event)
window.event.returnValue = result;
return result;
}

onkeypress="checkInput('des',this,250)

show and hide used in tab panel

2007-05-13T10:22:00.000+05:30