Archive

Posts Tagged ‘HTML’

Set timeout and Clear timeout in Javascript

May 16th, 2007 Anuraj P No comments

Timing events in javascript helps to execute a function, after a specified time interval.

setTimeout() – Executes a code some time in the future.
clearTimeout() – Cancel an existing setTimeout event.

var somevariable = setTimeout("function_to_execute",milliseconds);
clearTimeout(somevariable)

Here is sample code snippet for a Javascript counter using SetTimeout and ClearTimeout functions.

Timing events in javascript helps to execute a function, after a specified time interval.

setTimeout() – Executes a code some time in the future.
var somevariable = setTimeout(“function_to_execute”,milliseconds);

clearTimeout() – Cancel an existing setTimeout event.
clearTimeout(somevariable)

Code of a javascript counter.

<html>
<head>
    <title>Javascript counter</title>

    <script type="text/javascript" language="Javascript">
        var var_counter = 0;
        var var_timer;
        function start_counter() {
            document.getElementById("counter").innerText = var_counter;
            var_counter++; var_timer = setTimeout("start_counter()", 1000);
        }
        function stop_counter() {
            clearTimeout(var_timer);
        }
    </script>
</head>
<body>
    Counter :
    <div id="counter">
    </div>
    <br />
    <button onclick="start_counter()">
        Start</button>
    <button onclick="stop_counter()">
        Stop</button>
</body>
</html>

if var_counter variable is local scope instead of global, every time clicking on start button will initialize the counter.

There is two more timing related functions available in Javascript.

SetInterval() and ClearInterval() – It is almost same as the SetTimeout and clearTimeout, only difference is setTimeout() triggers expression only once, setInterval() keeps triggering expression again and again (unless you tell it to stop). And the Syntax are same. You can write the counter with SetInterval very easily that setTimeOut

Categories: Javascript Tags: , , , ,

Cookies in Javascript

May 15th, 2007 Anuraj P No comments

A cookie is a variable that is stored on the visitor’s computer. Each time the same computer requests a page with a browser, it will send the cookie to the client machine. Cookies are KeyValue Pairs.

Create a Cookie.

This code will prompt for a name, and save the username in a cookie.

var username = prompt("Enter your name");
document.cookie = "username=" + username;

Reading a cookie

This code will read the value from the cookie and alert the username.

var cookiename = "username="
var startcookie = document.cookie.indexOf(cookiename) + cookiename.length;
var endcookie = document.cookie.length;
alert(document.cookie.substring(startcookie,endcookie));

This is a simple example, you can also look for expriy date of cookie, is a cookie secure etc.

To disble cookies in browser(It depends on the Browser)

Microsoft Internet Explorer 6

Tools > Internet Options > Privacy > Click advanced and check Override Automatic cookie handling checkbox, and choose the radio buttons.

Categories: Javascript Tags: , , ,

Adding and reading values from combo box using Javascript

May 11th, 2007 Anuraj P 7 comments

If you are using Ajax Pro or MS Ajax with Page methods(Available in ASP.Net 3.5), you may want to fill a dropdown list from client side. This code snippet will help you to add items to dropdownlist(combobox) in runtime using Javascript.

Code to Add an option to combo using Javascript.

var combobox = document.getElementById("combobox");
for (var i=0; i &lt; 10; i++)
{
combobox.options[i] = new Option(i,i); //This code will work.
combobox.options.add(new Option(i,i));//This code will also work.
}

This will create 10 items in the combobox. And to read from the combo box

var combobox = document.getElementById("combobox");
for(var i = 0; i < combobox.options.length; i++)
{
alert(combobox.options[i].value);
}

This will alert all the 10 values from the combo box.

Categories: Javascript Tags: , ,

Javascript confirm dialogs from link buttons of Datagrid

May 5th, 2007 Anuraj P No comments

If you are using DataGrid or GridView in ASP.Net, we may require to display a confirmation, like when you are deleting a record. This code will help to display confirmation dialogs from Client side, with ASP.Net Datagrid control or Gridview control etc.

<span onclick="return confirm('Are you sure you want to delete this record?');">
<asp:linkbutton runat="server" id="Delete" CommandName="Delete"
commandArgument='<%#Container.DataItem("field")%>' Text="Delete" />
</span>
Categories: .Net, Javascript Tags: , ,

Disable right click with Javascript

April 18th, 2007 Anuraj P No comments

Here is two javascript code, helps you to disable right click, on webpages with Javascript.

function NoRightClick() {
if (event.button == 2)
{
alert("This action is not possible")
}
}
document.onmousedown=NoRightClick;

Or you can simply use.

<body oncontextmenu="return(false);">

This second code works only in Microsoft Internet Explorer.

Categories: Javascript Tags: , , ,