Skip to main content

Posts

Showing posts with the label Javascript

How To Create Simple Barchart using Javascript

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Chart.aspx.cs" Inherits="Chart" %><!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><headrunat="server"><title>Untitled Page</title><scripttype="text/javascript">function BarChart() { document.getElementById("Bar1").style.width = document.getElementById("Qty1").value; document.getElementById("Bar2").style.width = document.getElementById("Qty2").value; document.getElementById("Bar3").style.width = document.getElementById("Qty3").value; document.getElementById("Bar4").style.width = document.getElementById("Qty4").value; document.getElementById("Bar5").style.width = document.getElementById("Qty5&q…

How To Create Dynamic Div Using Javascript

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DynamicDiv.aspx.cs" Inherits="DynamicDiv" %><!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><headrunat="server"><title>Javascript create new div</title><styletype="text/css"> .dynamicDiv { width : 200px; height : 100px; border : solid 1px #c0c0c0; background - color : #e1e1e1; font - size : 11px; font - family : verdana; color : #000; padding : 5px; } </style><scripttype="text/javascript"language="javascript">function createDiv() { var divTag = document.createElement("div"); divTag.id = "div1"; divTag.setAttribute("align", "center"); divTag.style.margin = "0px auto";…

Working with the DOM

<%@ Page Language="C#" %>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<scriptrunat="server">

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DOM Tree 2</title>
</head>
<body>
<h1 id="hdr1">
This is the Header</h1>
<p id="p1">
This is a paragraph of text.</p>
<ul id="ul1">
<li>List Item 1</li>
<li>List Item 2</li>
</ul>

<script type="text/javascript">
// Get a node reference to the header element
var hdr = document.getElementById("hdr1");
// Use that reference to change the text/data.
hdr.firstChild.data = "My Dynamically written Header Text";
// Get a node reference to the paragraph element
var paragraph = document.getEl…

How To Open div popup with a LightBox effect

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DivBox.aspx.cs"
Inherits="DivBox" %>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<title>Untitled Page</title>
<scripttype="text/javascript">

function showBox()
{
var width = document.documentElement.clientWidth + document.documentElement.scrollLeft;

var layer = document.createElement('div');
layer.style.zIndex = 2;
layer.id = 'layer';
layer.style.position = 'absolute';
layer.style.top = '0px';
layer.style.left = '0px';
layer.style.height = document.documentElement.scrollHeight + 'px';
layer.style.width = width + 'px';
layer.style.backgroundColor = 'black';
layer.style.opacity = '.6';
layer.styl…

JavaScript Get Key Values Or Code On KeyDown

<html><head><metahttp-equiv="Content-Type"content="text/html; charset=windows-1252"><title>Find KeyCode</title><scriptlanguage="JavaScript">function TriggeredKey(e) { var keycode; if (window.event) keycode = window.event.keyCode; alert("keycode: " + keycode); } </script></head><bodyonkeydown="TriggeredKey(this)"></body></html>Special Keyboard Key(s) CodeKeyCodeBackspace 8Tab 9Enter 13 Shift 16 Ctrl 17 Alt 18 Pause/Break 19 Caps Lock 20 Esc 27 Page Up 33 Page Down 34 End 35 Home 36 Left Arrow 37 Print Screen 44Delete 46F1 112F2 113F3 114F4 115F5 116F6 117F7 118F8 119F9 120F10 121F11 122F12 123

Restrict User From Ctrl Key Press

<html><head><metahttp-equiv="Content-Type"content="text/html; charset=windows-1252"><title>Restrict Ctrl Key Press</title><script>function Restrict() { if ((window.event.keyCode == 17)) { alert("Ctrl Key Press In !" + '\r\n' + "Add Your Own Code Here"); // Add Your Code Here } } </script></head><bodyonload="JavaScript:document.body.focus();"onkeydown="Restrict()"></body></html>

Get Mouse Position Using JavaScript

<html><body><scriptlanguage="JavaScript"> document.onmousemove = getCoordinate; var mosX = 0; var mosY = 0; function getCoordinate(e) { mosX = event.clientX + document.body.scrollLeft; //clientX Property Sets or retrieves the x-coordinate of the mouse//pointer's position relative to the client area of the window,//excluding window decorations and scroll bars//scrollLeft Property Sets or retrieves the distance between the//left edge of the object and the leftmost portion of the content//currently visible in the window. mosY = event.clientY + document.body.scrollTop; //clientY Property Sets or retrieves the y-coordinate of the mouse//pointer's position relative to the client area of the window,//excluding window decorations and scroll bars.//scrollTop Property Sets or retrieves the distance between the top//of the object and the topmost portion of the content currently…

javascript function for invoking button click event

<htmlxmlns="http://www.w3.org/1999/xhtml"><headrunat="server"><title>javascript function for invoking btnclick event</title><scriptlanguage="javascript"type="text/javascript">function TrigButton() { if (window.event.keyCode == 13) { if (document.getElementById('txt').value.length > 0) { document.getElementById('bt').focus(); document.getElementById('bt').click(); } } } </script></head><body><formid="form1"runat="server"><div><asp:textboxid="txt"runat="server"onkeydown="TrigButton()"></asp:textbox><asp:buttonid="bt"runat="server"text="Button"onclientclick="javascript:alert('Button Triggered');"onclick="bt_Click"/></div></f…

Restrict Numberic Input In TextBox

<html><head><scriptlanguage="javascript">function blockNum(e) { var keyVal = (window.event) ? event.keyCode : e.keyCode; if (window.event) keyVal = window.event.keyCode; if ((keyVal > 47 && keyVal < 58) || (keyVal > 95 && keyVal < 107)) { returnfalse; } } </script></head><bodyonload="javascript:document.getElementById('txt').focus();"><inputtype="text"id='txt'onkeydown="return blockNum(this);"/></body></html>

Restrict Alphabet Input In TextBox

<html><head><scriptlanguage="javascript">function blockChar(e) { var keyVal = (window.event) ? event.keyCode : e.keyCode; if (window.event) keyVal = window.event.keyCode; if ((keyVal > 64 && keyVal < 93)) { returnfalse; } } </script></head><bodyonload="javascript:document.getElementById('txt').focus();"><inputtype="text"id='txt'onkeydown="return blockChar(this);"/></body></html>

How TO Add copy to clipboard Button On Page

<html><head></head><body><textareaid='clipText'> Enter Text And Click Button To Copy Text To ClipBoard</textarea><br/><inputtype="button"id='bt'onclick="clipboardData.setData('Text',document.getElementById('clipText').value);"value="Copy"/><inputtype="button"onclick="clipboardData.clearData('Text');"value="Clear"/><inputtype="button"onclick="alert(clipboardData.getData('Text'));"value="Paste"/></body>

How To Block F5(Refresh) Key In IE and Firefox

<html><head><metahttp-equiv="Content-Type"content="text/html; charset=windows-1252"><title>Block F5 Key In IE & Mozilla</title><scriptlanguage="JavaScript">var version = navigator.appVersion; function showKeyCode(e) { var keycode = (window.event) ? event.keyCode : e.keyCode; if ((version.indexOf('MSIE') != -1)) { if (keycode == 116) { event.keyCode = 0; event.returnValue = false; returnfalse; } } else { if (keycode == 116) { returnfalse; } } } </script></head><bodyonload="JavaScript:document.body.focus();"onkeydown="return showKeyCode(event)"></body></html>

Sample source code for JavaScript Page Processing

We have provided below sample source code for JavaScript Page Processing in Asp.Net. You can copy and paste it in your pages to create the sample application. Code for Processing Page (PageProcessor.aspx) <htmlxmlns="http://www.w3.org/1999/xhtml"><headrunat="server"><title>Please wait...We Are Processing Your Request..</title><script>function PageOnLoad() { location.href = "<%=PageToLoad%>"; document.images['imgsrc'].src = "Images/Loading.gif"; } </script></head><bodybottommargin="0"leftmargin="0"rightmargin="0"topmargin="0"onload="PageOnLoad();"><formid="form1"runat="server"><div><tableborder="0"cellpadding="0"cellspacing="0"height="100%"width="100%"><tr><tdheight="50"class="NormalTe…

Trapping close of IE window in ASP.NET

Trap window close event for IE browser Let's say you want to trap the window close event for the web browser so that you can give a confirmation dialog asking if the user is sure to leave the page.The problem is that there is no onclose event for the window object.The closest event might be onunload since it fires immediately before the window object is unloaded. However, when the onunload event fires it is too late to display a JavaScript alert. Therefore, we need an event that fires prior to a page being unloaded, which is onbeforeunload. Define onbeforeunload event in your page <BODY> element as follows: <BODY onbeforeunload="HandleOnClose()"> Then, add the following JavaScript code into the <HEAD> section of your ASPX page: <scripttype="text/javascript">function HandleOnClose() { if (event.clientY < 0) { event.returnValue = 'Are you sure you want to leave the page?'; } }����…