Skip to main content

Posts

Showing posts with the label javascript

Disable Right Click in Form by Java Script

Disable the right click in forms using JavaScript  Script : var message="Function Disabled";  function clickIE() {if (document.all) {(message);return false;}}  function clickNS(e) {if  (document.layers||(document.getElementById&&!document.all)) {  if (e.which==2||e.which==3) {(message);return false;}}}  if (document.layers)  {document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}  else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}  document.oncontextmenu=new Function("return false") 

Different Tab Style, expanding of arbitrary DIVs on the page enabled

Different Tab Style, expanding of arbitrary DIVs on the page enabled <html> <head> <link rel="stylesheet" type="text/css" href="http://www.dynamicdrive.com/dynamicindex17/tabcontent/tabcontent.css" /> <script type="text/javascript" src="http://www.dynamicdrive.com/dynamicindex17/tabcontent/tabcontent.js"> /*********************************************** * Tab Content script v2.2- © Dynamic Drive DHTML code library (www.dynamicdrive.com) * This notice MUST stay intact for legal use * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code ***********************************************/ </script> </head> <body> <h3>Demo #1- Basic implementation</h3> <ul id="countrytabs" class="shadetabs"> <li><a href="#" rel="country1" class="selected">Tab 1</a></li> <li>...

Light Effect Text using javascript

Light Effect Text using javascript <script language="JavaScript1.2"> var message="Welcome to Visitor!" var neonbasecolor="green" var neontextcolor="black" var flashspeed=100  //in milliseconds ///No need to edit below this line///// var n=0 if (document.all||document.getElementById){ document.write('<font color="'+neonbasecolor+'">') for (m=0;m<message.length;m++) document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>') document.write('</font>') } else document.write(message) function crossref(number){ var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number) return crossobj } function neon(){ //Change all letters to base color if (n==0){ for (m=0;m<message.length;m++) //eval("document.all.neonlight"+m).style.color=...

TextArea text Count on typing

TextArea Count and Max Length ( Displaying ) on Keyup <html> <head> <script type="text/javascript"> function textCounter(textarea, counterID, maxLen) { cnt = document.getElementById(counterID); if (textarea.value.length > maxLen){ textarea.value = textarea.value.substring(0,maxLen); } cnt.innerHTML = maxLen - textarea.value.length; } </script></head> <body>  <textarea name="mytext" id="mytext" style="width:99%; height:100px;" value="" onkeyup="textCounter (this,'count_display',255);" onBlur="textCounter(this,'count_display',255);"></textarea>   <span id="count_display">255</span> a </span> </body> </html>

Create Dynamic Rows using javascript

Create Dynamic Rows using javascript <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <link href="/style.css" rel="stylesheet" type="text/css" /> <title>More form fields</title> <script type="text/javascript"> function addRowToTable() {   var tbl = document.getElementById('tblAddress');   var lastRow = tbl.rows.length;   // if there's no header row in the table, then iteration = lastRow + 1   var iteration = lastRow; //  var iteration = lastRow + 1;   var row = tbl.insertRow(lastRow);   //  cell 0   var cell0 = row.insertCell(0);   var el = document.createElement('input');   el.type = 'text';   el.NAME = 'Address[]';   el.size = 30;   cell0.app...

Popup form on Screen Center Javascript

Popup Form on Center  to popup the form on Screen Center use the below Script Example : <script language="javascript"> var popupWindow = null; function centeredPopup(url,winName,w,h,scroll){ LeftPosition = (screen.width) ? (screen.width-w)/2 : 0; TopPosition = (screen.height) ? (screen.height-h)/2 : 0; settings = 'height='+h+',width='+w+',top='+TopPosition+',left='+LeftPosition+',scrollbars='+scroll+',resizable' popupWindow = window.open(url,winName,settings) } </script> <p><a href="http://www.quackit.com/common/link_builder.cfm" onclick="centeredPopup(this.href,'myWindow','500','300','yes');return false">Centered Popup</a></p>

Get Query String Values by Javascript

Get Query String Values by Javascript Script Function function GET () { var data = []; for ( x = 0 ; x < arguments . length ; ++ x ) data . push ( location . href . match ( new RegExp ( "/\?" . concat ( arguments [ x ], "=" , "([^\n&]*)" )))[ 1 ]) return data ; } Example : data = GET ( "id" , "name" , "foo" ); query string : ? id = 3 & name = jet & foo = b returns : data [ 0 ] // 13 data [ 1 ] // jet data [ 2 ] // b or alert ( GET ( "id" )[ 0 ]) // return 3

Calculate No of Years,Months and Days Between two Dates by Javascript

Calculate No of Years,Months and Days Between two Dates by Javascript <script language="JavaScript"><!-- //function getAge(dateString,dateType) function CalbwDates() { /*    function getAge    parameters: dateString dateType    returns: boolean    dateString is a date passed as a string in the following    formats: Types :    type 1 : 19970529    type 2 : 970529    type 3 : 29/05/1997    type 4 : 29/05/97    dateType is a numeric integer from 1 to 4, representing    the type of dateString passed, as defined above.    Returns string containing the age in years, months and days    in the format yyy years mm months dd days.    Returns empty string if dateType is not one of the expected    values. */ //var FirstDate=document.getElementById('ctl00_ContentPlaceHolder1_TextBox1').value; //var SecondDate=...

On Load Message

On Load Function Displaying Loading Message <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title></title> <script type="text/javascript"> function hideLoading() { document.getElementById('divLoading').style.display = "none"; document.getElementById('divFrameHolder').style.display = "block"; } </script> </head> <body> <form id="form1" runat="server"> <div id="divLoading"> <img src="loadingAnimation.gif" alt="" /> </div> <div id="divFrameHolder" style="display:none"> <iframe src="http://asp.net" onload="hideLoading()" frameborder="1" scrolling="no"> </iframe> </div> </form> </body>...

Java Script Validation for Text Boxes

Java Script Validation for Text Boxes     function NumberhyphenOnly()         {            var AsciiValue=event.keyCode             if((AsciiValue>=48 && AsciiValue<=57) || (AsciiValue==8 || AsciiValue==127) || (AsciiValue==45) || (AsciiValue==47))                 event.returnValue=true;             else             {                 event.returnValue=false;                                 alert("Enter NumericValues, '/...

Client Clock by javascript

Client Clock by javascript Place the code below the head tag <script language="Javascript" type="text/javascript"> setInterval("settime()", 1000); function settime () {   var curtime = new Date();   var curhour = curtime.getHours();   var curmin = curtime.getMinutes();   var cursec = curtime.getSeconds();   var time = "";   if(curhour == 0) curhour = 12;   time = (curhour > 12 ? curhour - 12 : curhour) + ":" +          (curmin < 10 ? "0" : "") + curmin + ":" +          (cursec < 10 ? "0" : "") + cursec + " " +          (curhour > 12 ? "PM" : "AM");      document.getElementById('clock').value =time;   //document.getElementById('sample').value=time;   document.getElementById('mydiv').innerHTML  ="<h3>"+time+"</h3>";   } </script> place the code below the bod...

Tool tip by javascript

 Tool tip by javascript: Copy the code under the </head> tag <style type="text/css"> #dhtmltooltip{ position: absolute; width: 150px; border: 2px solid black; padding: 2px; background-color: lightyellow; visibility: hidden; z-index: 100; /*Remove below line to remove shadow. Below line should always appear last within this CSS*/ filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135); } </style> Copy the code under the </body> Tab <div id="dhtmltooltip"></div> <script type="text/javascript"> var offsetxpoint=-60 //Customize x offset of tooltip var offsetypoint=20 //Customize y offset of tooltip var ie=document.all var ns6=document.getElementById && !document.all var enabletip=false if (ie||ns6) var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : "" function ietruebody(){ retu...

copy data between form fields by javascript

copy data between form fields by javascript  JavaScript: <script type="text/javascript"> function CopyAddress() { if(document.getElementById("ctl00_cphhead_chkpresentaddress").checked) { document.getElementById("ctl00_cphhead_txtpermantaddress").value=document.getElementById("ctl00_cphhead_txtaddress").value; } else { document.getElementById("ctl00_cphhead_txtpermantaddress").value=""; } } </script> Present Address TextBox:     <asp:TextBox ID="txtaddress" runat="server" TextMode="MultiLine" Height="50px"                     Width="140px" onkeyup="CopyAddress();"></asp:TextBox></td> CheckBox: <asp:CheckBox ID="chkpresentaddress" runat="server" onclick="CopyAddress();" />

Show Large Image on MouseOver using JavaScript

Show Large Image on MouseOver using JavaScript <%@ Page Language="VB" AutoEventWireup="false" CodeFile="LargeImage.aspx.vb" Inherits="sample_LargeImage" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server">     <title>Untitled Page</title> <script type="text/javascript" language="ecmascript">         function ShowBiggerImage(obj)         {             document.getElementById("LargeImageContainerDiv").innerHTML = "<img src='" + obj.src + "'+'width=150 height=200' >";         }         function ShowDefaultImage(obj)         {      ...

Display animated gif before Iframe content is loaded

Display animated gif before Iframe content is loaded   If you are working with iframe in which the content takes time to load, you may want to display a simple loading indicator to the end users instead of letting the users see a blank screen in the page. To do this, here's one way on how to implemet it using javascript.  <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server">     <title></title>     <script type="text/javascript">        function hideLoading() {             document.getElementById('divLoading').style.display = "none";             document.getElementById('divFrameHolder').style.display = "block";         }     </script> </head> <body>     <form id="form1" run...

GridView Calculation with JavaScript

GridView Calculation with JavaScript In my previous post I wrote a simple demo on how to Calculate Totals in GridView and Display it in the Footer . Basically what it does is it calculates the total amount by typing into the TextBox and display the grand total in the footer of the GridView and basically it was a server side implemenation.  Many users in the forums are asking how to do the same thing without postbacks and how to calculate both amount and total amount together. In this post I will demonstrate how to do this using JavaScript. To get started let's go ahead and set up the form. Just for the simplicity of this demo I just set up the form like this: <asp:gridview ID="GridView1"   runat="server"   ShowFooter="true" AutoGenerateColumns="false">         <Columns>         <asp:BoundField DataField="RowNumber" HeaderText="Row Numb...