Showing posts with label JAVASCRIPT. Show all posts
Showing posts with label JAVASCRIPT. Show all posts
Print a web page using PHP/JavaScript Code
Print a web page using PHP/JavaScript Code
In this article I will show how to Print a HTML Web Page using PHP/JavaScript.I have Written simple script to print Visitor card in PHP.On web page, there is a print option. When the user click on `print` Button it will send a print command to the printer.
We are using Javascript window.print(); function to print HTML portion of a Web Page.
Javascript window.print():
The window.print() method prints the contents of the current page.This method is supported in all major browsers.
Example: How to Print a Web Page Using JavaScript and PHP.
In this article I will show how to Print a HTML Web Page using PHP/JavaScript.I have Written simple script to print Visitor card in PHP.On web page, there is a print option. When the user click on `print` Button it will send a print command to the printer.
We are using Javascript window.print(); function to print HTML portion of a Web Page.
Javascript window.print():
The window.print() method prints the contents of the current page.This method is supported in all major browsers.
Example: How to Print a Web Page Using JavaScript and PHP.
<!DOCTYPE html>
<HTML lang="en"><HEAD>
<TITLE>Print Visitor card using PHP/JavaScript </TITLE>
<META content=IE=7 http-equiv=X-UA-Compatible>
<META content="text/html; charset=Windows-1252" http-equiv=Content-Type>
<STYLE>
#outer
{
border-collapse:collapse;
border: 0px solid black;
height:250px;width:420px;
}
.cover{
background:#EEEEEE;
padding: 10px;
text-align:left;
margin:10px;
width:400px;
height:200px;
font-size: 1.0em;
top:10%; left:10%;
/*--CSS3 Box Shadows--*/
-webkit-box-shadow: 0px 0px 20px #000;
-moz-box-shadow: 0px 0px 20px #000;
box-shadow: 0px 0px 20px #000;
/*--CSS3 Rounded Corners--*/
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
#inner
{
border-collapse:collapse;
border: 0px solid black;
height:100%;width:100%;
background:#EEEEEE;
}
#hgt_abv
{ height:18%;}
#hgt_abv_back
{ float:inherit;
height:18px;
width:400px;
background:#000000;
}
#hgt_belo
{ height:3%;background:#FF6600;}
.docimg
{
float:inherit;
hight:119px;
width:90px;
}
.logo
{
float:left;
width:100px;
}
.address
{
padding:2px;
text-align:left;
margin:2px;
hight:100px;
width:130px;
font-size: 1.1em;
}
</STYLE>
<META name=GENERATOR content="MSHTML 9.00.8112.16446"></HEAD>
<BODY class="ExtravaganzaAqua page-view2" >
<CENTER><SPAN></SPAN>
<TABLE id=outer>
<TR>
<TD><DIV class=cover>
<TABLE id=inner border=0>
<TR>
<TD align=center colspan="2">
<DIV id=hgt_abv_back><FONT color=#ffffff size=3><B>VISITOR PASS</B></FONT></DIV>
</TD>
</TR>
<TR>
<TD valign="top" align=left><br /><FONT size=2><B>Name: </B><B>Computer Geek</B><br /><br /><br />
<B>Designation: </B><B>Software Engg.</B><br /><br /><br />
<B>Date: </B><B>24th Nov 2012</B><br />
</FONT>
</TD>
<TD valign="top" align=right>
<img width="90" hight="119px" src="user.jpg" alt="bg">
</TD>
</TR>
<TR id=hgt_belo>
<TD colSpan=2></TD>
</TR>
</TABLE>
</DIV>
</TD>
</TR>
</TABLE>
</CENTER>
<center>
<table id=outer>
<tr>
<td align="right" valign="top">
<button type="button" onclick="window.print();" >Print</button>
</td>
</tr>
</table>
</center>
</BODY>
</HTML>
I hope this example will help you to Print a Web Page Using JavaScript and PHP.
Disabling right click/Cut/Copy/Paste into HTML form using Javascript | Disable view Source
Disabling right click/Cut/Copy/Paste into HTML form using Javascript | Disable view Source
In this article,I will explain how to Disable cut, copy, paste, right click and context menu using Javascript.Some times we need to disable the right click option in the web browser for security
reason.Disable view source is the Best way to prevent content hijacking.You can Protect images,content by disabling right-click on a web page..with below script you can disable right click in the entire page using Javascript.
In this article,I will explain how to Disable cut, copy, paste, right click and context menu using Javascript.Some times we need to disable the right click option in the web browser for security
reason.Disable view source is the Best way to prevent content hijacking.You can Protect images,content by disabling right-click on a web page..with below script you can disable right click in the entire page using Javascript.
Remove first character of string in jquery/javascript
Remove first character of string in jquery/javascript.
In this tutorial, I will explain how to remove first character of a string in javascript.To remove the first character of a string can be easily done by javascript functions
Example:How to delete first character from a string using javascript/jQuery?
<script language="javascript" type="text/javascript">
var string = 'Hello!';
var new_string = string.substring(1);//This will only removes the first character
alert(new_string);
</script>
In this tutorial, I will explain how to remove first character of a string in javascript.To remove the first character of a string can be easily done by javascript functions
Example:How to delete first character from a string using javascript/jQuery?
<script language="javascript" type="text/javascript">
var string = 'Hello!';
var new_string = string.substring(1);//This will only removes the first character
alert(new_string);
</script>
Export to excel in php with jquery/Javascript
Export to excel in php with jquery/Javascript
In this article,I will explain how to export excel file in php with JQuery.we are going to export an HTML table to a MS Excel document as it is displayed on the HTML page.it is very easy to export PHP HTML data to excel in PHP.please check following Export to excel example.
Example:Export to excel in php
File:php_export_to_excel.php
<?php
if(isset($_REQUEST['csvdata']))
{
////download to excel
header('Content-Type: application/force-download');
header('Content-disposition: attachment; filename=csv_excel.xls');
header("Pragma: ");
header("Cache-Control: ");
echo $_REQUEST['csvdata'];
exit();
}
?>
<html>
<head>
<script>
function getCsvData()
{
$("#csvdata").val($("<span>").append ($("#customers").eq(0).clone()).html());
return true;
}
</script>
<title>Export to excel in php with Jquery</title>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
<html>
<head>
<style type="text/css">
#customers
{
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
width:50%;
border-collapse:collapse;
}
#customers td, #customers th
{
font-size:1em;
border:1px solid #999999;
padding:3px 7px 2px 7px;
}
#customers th
{
font-size:1.1em;
text-align:left;
padding-top:5px;
padding-bottom:4px;
background-color: #666666;
color:#ffffff;
}
#customers tr.alt td
{
color:#000000;
background-color: #CCCCCC;
}
</style>
</head>
<body>
<form method="post" onSubmit="javascript:return getCsvData()">
<table align="center" id="customers">
<tr>
<th>Company</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Germany</td>
</tr>
<tr class="alt">
<td>Berglunds snabbköp</td>
<td>Sweden</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Mexico</td>
</tr>
<tr class="alt">
<td>Ernst Handel</td>
<td>Austria</td>
</tr>
<tr>
<td>Island Trading</td>
<td>UK</td>
</tr>
<tr class="alt">
<td> Essen</td>
<td>Germany</td>
</tr>
<tr>
<td>Laughing Bacchus Winecellars</td>
<td>Canada</td>
</tr>
<tr class="alt">
<td>Magazzini</td>
<td>Italy</td>
</tr>
<tr>
<td>North/South</td>
<td>UK</td>
</tr>
<tr class="alt">
<td>ABC</td>
<td>France</td>
</tr>
</table>
<table align="center" id="customers1">
<tr>
<td colspan="6"align="center"><input type="hidden" id="csvdata" name="csvdata">
<input type="submit" value="Export to Excel"> </td>
</tr>
</table>
</form>
</body>
</html>
In this article,I will explain how to export excel file in php with JQuery.we are going to export an HTML table to a MS Excel document as it is displayed on the HTML page.it is very easy to export PHP HTML data to excel in PHP.please check following Export to excel example.
Example:Export to excel in php
File:php_export_to_excel.php
<?php
if(isset($_REQUEST['csvdata']))
{
////download to excel
header('Content-Type: application/force-download');
header('Content-disposition: attachment; filename=csv_excel.xls');
header("Pragma: ");
header("Cache-Control: ");
echo $_REQUEST['csvdata'];
exit();
}
?>
<html>
<head>
<script>
function getCsvData()
{
$("#csvdata").val($("<span>").append ($("#customers").eq(0).clone()).html());
return true;
}
</script>
<title>Export to excel in php with Jquery</title>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
<html>
<head>
<style type="text/css">
#customers
{
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
width:50%;
border-collapse:collapse;
}
#customers td, #customers th
{
font-size:1em;
border:1px solid #999999;
padding:3px 7px 2px 7px;
}
#customers th
{
font-size:1.1em;
text-align:left;
padding-top:5px;
padding-bottom:4px;
background-color: #666666;
color:#ffffff;
}
#customers tr.alt td
{
color:#000000;
background-color: #CCCCCC;
}
</style>
</head>
<body>
<form method="post" onSubmit="javascript:return getCsvData()">
<table align="center" id="customers">
<tr>
<th>Company</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Germany</td>
</tr>
<tr class="alt">
<td>Berglunds snabbköp</td>
<td>Sweden</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Mexico</td>
</tr>
<tr class="alt">
<td>Ernst Handel</td>
<td>Austria</td>
</tr>
<tr>
<td>Island Trading</td>
<td>UK</td>
</tr>
<tr class="alt">
<td> Essen</td>
<td>Germany</td>
</tr>
<tr>
<td>Laughing Bacchus Winecellars</td>
<td>Canada</td>
</tr>
<tr class="alt">
<td>Magazzini</td>
<td>Italy</td>
</tr>
<tr>
<td>North/South</td>
<td>UK</td>
</tr>
<tr class="alt">
<td>ABC</td>
<td>France</td>
</tr>
</table>
<table align="center" id="customers1">
<tr>
<td colspan="6"align="center"><input type="hidden" id="csvdata" name="csvdata">
<input type="submit" value="Export to Excel"> </td>
</tr>
</table>
</form>
</body>
</html>
Find textbox length in javascript
Find textbox length in javascript
In this tutorial,I will explain how to find the length of textbox using javascript.It is very easy to find textbox length in javascript.we can use javascript length property.
Example:Find textbox length in javascript
<html>
<head>
<title>Textbox limit characters</title>
<script>
function findTextboxLength()
{
textbox_val=textbox1.value;//gets the value of the input element entered by the user.
textbox_length = textbox_val.length;//find the length of textbox in javascript
if (textbox_length < 10)
{
char = 10 - textbox_length;
msg = char + " characters left";
text_span.innerHTML="<font color=blue>" + msg + "</font>";
}
else
{
text_span.innerHTML="<font color=red>Message is too long</font>";
}
}
</script>
</head>
<INPUT type="text" id="textbox1" onKeyUp="findTextboxLength();" >
<span id="text_span" name="text_span"></span>
</html>
In this tutorial,I will explain how to find the length of textbox using javascript.It is very easy to find textbox length in javascript.we can use javascript length property.
Example:Find textbox length in javascript
<html>
<head>
<title>Textbox limit characters</title>
<script>
function findTextboxLength()
{
textbox_val=textbox1.value;//gets the value of the input element entered by the user.
textbox_length = textbox_val.length;//find the length of textbox in javascript
if (textbox_length < 10)
{
char = 10 - textbox_length;
msg = char + " characters left";
text_span.innerHTML="<font color=blue>" + msg + "</font>";
}
else
{
text_span.innerHTML="<font color=red>Message is too long</font>";
}
}
</script>
</head>
<INPUT type="text" id="textbox1" onKeyUp="findTextboxLength();" >
<span id="text_span" name="text_span"></span>
</html>
Javascript get url parameters
Javascript get url parameters.
In this article, I will explain how to get url parameters in javascript.We are using following JavaScript code to get url parameters using javascript.I have written simple javascript function which will get a URL parameter and return it to you.
Suppose,My URL is http://example.com/pagename.html?a=1&b=2 and i want to
get parameters a=1,b=2
please check following code to Retrieve URL GET parameters with Javascript.
In this article, I will explain how to get url parameters in javascript.We are using following JavaScript code to get url parameters using javascript.I have written simple javascript function which will get a URL parameter and return it to you.
Suppose,My URL is http://example.com/pagename.html?a=1&b=2 and i want to
get parameters a=1,b=2
please check following code to Retrieve URL GET parameters with Javascript.
Javascript get url page name
Javascript get url page name.
In this article, I will explain how to get page name from url in javascript.We are using following JavaScript code to get url page name using javascript.The filename is the last part of the URL from the last trailing slash ('/').
Suppose,My URL is http://example.com/pagename.html and i want to get page name pagename.html
In this article, I will explain how to get page name from url in javascript.We are using following JavaScript code to get url page name using javascript.The filename is the last part of the URL from the last trailing slash ('/').
Suppose,My URL is http://example.com/pagename.html and i want to get page name pagename.html
Avoid jQuery conflict with Other JavaScript library(prototype,YUI,mootools)
Avoid jQuery conflict with Other JavaScript library(prototype,YUI,mootools)
In this jQuery article, I will explain how to avoid jquery conflict with other javascript libraries.
javascript libraries such as YUI, prototype conflict with Jquery library as prototype library also uses `$` sign.To resolve this issue, jQuery has .noConflict() method.
.noConflict() method: Relinquish jQuery's control of the $ variable (override the $ function)
we can avoid prototype and jquery conflict using .noConflict() method.
In this jQuery article, I will explain how to avoid jquery conflict with other javascript libraries.
javascript libraries such as YUI, prototype conflict with Jquery library as prototype library also uses `$` sign.To resolve this issue, jQuery has .noConflict() method.
.noConflict() method: Relinquish jQuery's control of the $ variable (override the $ function)
we can avoid prototype and jquery conflict using .noConflict() method.
Insert dynamic row in table using jquery
Insert dynamic row in table using jquery
In this tutorial,I will show how to insert dynamic row in table using jquery.
dynamically add row in table using jquery is very simple as jQuery provides clone() function to clone HTML elements. Using this function we can clone a row and add this row to table using insertBefore() function.
For adding dynamic row in table, we have used insertRow() and clone() method.
In this tutorial,I will show how to insert dynamic row in table using jquery.
dynamically add row in table using jquery is very simple as jQuery provides clone() function to clone HTML elements. Using this function we can clone a row and add this row to table using insertBefore() function.
For adding dynamic row in table, we have used insertRow() and clone() method.
Remove last character of string in jquery/javascript
Remove last character of string in jquery/javascript.
In this tutorial, I will explain how to remove last character of a string in javascript.To remove the last character of a string can be easily done by javascript functions
Example:How to delete last character from a string using javascript/jQuery?
<script language="javascript" type="text/javascript">
var string = 'Hello!';
var new_string = string.substring(0, string.length-1);//This will only removes the last character
alert(new_string);
</script>
In this tutorial, I will explain how to remove last character of a string in javascript.To remove the last character of a string can be easily done by javascript functions
Example:How to delete last character from a string using javascript/jQuery?
<script language="javascript" type="text/javascript">
var string = 'Hello!';
var new_string = string.substring(0, string.length-1);//This will only removes the last character
alert(new_string);
</script>
Javascript get windows username
Javascript get windows username.
In this tutorial,I will explain how to get windows username using javascript.
Example1:Retrieve Windows Username with JavaScript Scripting
<html>
<head>
<script language="javascript">
function GetWindowsUserName()
{
var win = new ActiveXObject("WScript.Shell");
var username=(win.ExpandEnvironmentStrings("%USERNAME%"));
alert(username);
}
</script>
</head>
<body OnLoad="GetWindowsUserName();">
</body>
</html>
In this tutorial,I will explain how to get windows username using javascript.
Example1:Retrieve Windows Username with JavaScript Scripting
<html>
<head>
<script language="javascript">
function GetWindowsUserName()
{
var win = new ActiveXObject("WScript.Shell");
var username=(win.ExpandEnvironmentStrings("%USERNAME%"));
alert(username);
}
</script>
</head>
<body OnLoad="GetWindowsUserName();">
</body>
</html>
Javascript print this page,window,Div,Dialogue box
Javascript print this page,window,Div,Dialogue box
In this tutorial, I will explain how to print window using javascript.We are using JavaScript window.print() function to print a window of this page,print dialogue box,print div.One of the most basic JavaScript commands is document.write. This simply prints the specified text to the page.JavaScript programs cannot directly access printers.you need to generate the printable data in a separate browser window.
Example:How do I print JavaScript output?
Javascript print using Hyperlink:-
<a href= "javascript:window.print();"> Print</a>
Javascript print Button:-
//You can call the JavaScript print function .This will automatically open the print dialogue box for the user.
<input type="button" value="Print" onclick="window.print();">
In this tutorial, I will explain how to print window using javascript.We are using JavaScript window.print() function to print a window of this page,print dialogue box,print div.One of the most basic JavaScript commands is document.write. This simply prints the specified text to the page.JavaScript programs cannot directly access printers.you need to generate the printable data in a separate browser window.
Example:How do I print JavaScript output?
Javascript print using Hyperlink:-
<a href= "javascript:window.print();"> Print</a>
Javascript print Button:-
//You can call the JavaScript print function .This will automatically open the print dialogue box for the user.
<input type="button" value="Print" onclick="window.print();">
Restrict special characters being entered in textbox using jquery/javascript?
Restrict special characters being entered in textbox using jquery/javascript?
In this tutorial,I will explain how to restrict the special characters being entered in textbox using jquery/javascript.
It is very important to check user input text validity to prevent the sql injection that can harm your database.
In this tutorial,I will explain how to restrict the special characters being entered in textbox using jquery/javascript.
It is very important to check user input text validity to prevent the sql injection that can harm your database.
javascript padding/convert number to string with leading zeros
Javascript padding/convert number to string with leading zeros
In this tutorial,I will explain how to padding/convert number to a string with leading zeros.
padding in javascript is very easy.we are using javascript to format number with leading zero.
Example:Javascript format number with leading zero
<script language="javascript" type="text/javascript">
var number=10;
var num=Number(number);
num_to_string=num.toString();
if(num_to_string.length==1)
{
num_to_string=0+num_to_string;
}
alert(num_to_string);
</script>
In this tutorial,I will explain how to padding/convert number to a string with leading zeros.
padding in javascript is very easy.we are using javascript to format number with leading zero.
Example:Javascript format number with leading zero
<script language="javascript" type="text/javascript">
var number=10;
var num=Number(number);
num_to_string=num.toString();
if(num_to_string.length==1)
{
num_to_string=0+num_to_string;
}
alert(num_to_string);
</script>
Javascript:Disable Back Button in Browser (firefox,IE,..)
Javascript:Disable Back Button in Browser.
Disable Back Button in Browser(IE,firefox,Google Chrome, Opera, Safari, Internet Explorer) using javascript.
In this tutorial, I will explain how to disable the back button on FireFox's/IE browser.
this code will works for all web browsers such as Google Chrome, Opera, Safari, Internet Explorer etc.
Please check two methods to somewhat disable a browser's Back button.
<script language="javascript" type="text/javascript">
window.history.forward(1);
</script>
Disable Back Button in Browser(IE,firefox,Google Chrome, Opera, Safari, Internet Explorer) using javascript.
In this tutorial, I will explain how to disable the back button on FireFox's/IE browser.
this code will works for all web browsers such as Google Chrome, Opera, Safari, Internet Explorer etc.
Please check two methods to somewhat disable a browser's Back button.
<script language="javascript" type="text/javascript">
window.history.forward(1);
</script>
jquery trim spaces - jQuery $.trim method
jquery trim spaces - jQuery $.trim method
In this tutorial, I will explain how to removes the two whitespaces at the start and at the end of the string.
Removes the two whitespaces at the start and at the end of the string.
<html>
<title>jquery trim spaces</title>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
$("span").click(function () {
var str = " jquery trim spaces ";
str1 = jQuery.trim(str);
alert(str1);
str2 = $.trim(str);//using the jQuery $.trim method
alert(str2);
});
});
</script>
</head>
<body>
<span>jquery trim spaces</span>
</body>
</html>
I hope this tutorial will help you to remove whitespaces at the start and at the end of the string.
In this tutorial, I will explain how to removes the two whitespaces at the start and at the end of the string.
Removes the two whitespaces at the start and at the end of the string.
<html>
<title>jquery trim spaces</title>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
$("span").click(function () {
var str = " jquery trim spaces ";
str1 = jQuery.trim(str);
alert(str1);
str2 = $.trim(str);//using the jQuery $.trim method
alert(str2);
});
});
</script>
</head>
<body>
<span>jquery trim spaces</span>
</body>
</html>
I hope this tutorial will help you to remove whitespaces at the start and at the end of the string.
JQuery-Remove all spaces from string using javascript/JQuery/Regular expressions.
Remove all spaces from string using javascript/JQuery/Regular expressions.
In this tutorial, I will explain how to remove all spaces in a string using jquery,
remove all occurences of a character from a string.
I need to remove spaces in the string.I will use JQuery/Regular expressions/javascript to replace spaces from string.
You can replace string with '_','-'....etc.
Removing extra space from the string using javascript and Regular expression is very easy.
<script type="text/javascript">
function removeSpaces(str)
{
var s=str.replace(/\s/g, "");
return s;
}
var new_str=removeSpaces('jquery remove space from string using javascript');
</script>
In this tutorial, I will explain how to remove all spaces in a string using jquery,
remove all occurences of a character from a string.
I need to remove spaces in the string.I will use JQuery/Regular expressions/javascript to replace spaces from string.
You can replace string with '_','-'....etc.
Removing extra space from the string using javascript and Regular expression is very easy.
<script type="text/javascript">
function removeSpaces(str)
{
var s=str.replace(/\s/g, "");
return s;
}
var new_str=removeSpaces('jquery remove space from string using javascript');
</script>
jquery onclick change class script (.removeClass() and .addClass())
JQuery onclick change class (.removeClass() and .addClass())
In this example,I will show How to change class name using Jquery .removeClass() and .addClass() property.
Syntax:
.removeClass(className)
className will be One or more classes to be removed from the class attribute of each matched element.
In this example,I will show How to change class name using Jquery .removeClass() and .addClass() property.
Syntax:
.removeClass(className)
className will be One or more classes to be removed from the class attribute of each matched element.
Javascript Clock with timer - A countdown clock
Javascript Clock with timer-A countdown clock.
JavaScript Clock timer and alarm script.
In this section, I have written Simple javascript program to create clock with timing event.it is very easy to install Clock written in Javascript to put into your page.This script displays the live time in your HTML Page.I think every person displays clock with timer on his website.. so creating website with a countdown clock timer is very easy.
please check below javascript code:
Example: Javascript program to create clock with a timimg event?
<html>
<title>Javascript Clock with timer-A countdown clock.</title>
<head>
<script language="JavaScript">
function showClickTime(){
var Digital=new Date()
var hours=Digital.getHours()
var minutes=Digital.getMinutes()
var seconds=Digital.getSeconds()
var clockd="AM"
if (hours>12){
clockd="PM"
hours=hours-12
}
if (hours==0)
hours=12
if (minutes<=9)
minutes="0"+minutes
if (seconds<=9)
seconds="0"+seconds
var clocktime=hours+":"+minutes+":"+seconds+" "+clockd
clockSpan.innerHTML="<b style='font-size:12;color:blue;'>"+clocktime+"</b>"
setTimeout("showClickTime()",1000)
}
window.onload=showClickTime;
</script>
</head>
<body>
<span id=clockSpan>
</span>
</body>
</html>
JavaScript Clock timer and alarm script.
In this section, I have written Simple javascript program to create clock with timing event.it is very easy to install Clock written in Javascript to put into your page.This script displays the live time in your HTML Page.I think every person displays clock with timer on his website.. so creating website with a countdown clock timer is very easy.
please check below javascript code:
Example: Javascript program to create clock with a timimg event?
<html>
<title>Javascript Clock with timer-A countdown clock.</title>
<head>
<script language="JavaScript">
function showClickTime(){
var Digital=new Date()
var hours=Digital.getHours()
var minutes=Digital.getMinutes()
var seconds=Digital.getSeconds()
var clockd="AM"
if (hours>12){
clockd="PM"
hours=hours-12
}
if (hours==0)
hours=12
if (minutes<=9)
minutes="0"+minutes
if (seconds<=9)
seconds="0"+seconds
var clocktime=hours+":"+minutes+":"+seconds+" "+clockd
clockSpan.innerHTML="<b style='font-size:12;color:blue;'>"+clocktime+"</b>"
setTimeout("showClickTime()",1000)
}
window.onload=showClickTime;
</script>
</head>
<body>
<span id=clockSpan>
</span>
</body>
</html>
Dynamically Add/Remove rows in HTML table using JavaScript
This article shows you how to add/delete rows to an HTML table dynamically, using DHTML and JavaScript.The code has been tested to work with Firefox . It may work with other browsers.The sample code has two JavaScript functions - one to add new rows and the other to delete rows.
Example:
<HTML>
<HEAD>
<TITLE> Add/Remove dynamic rows in HTML table </TITLE>
<SCRIPT language="javascript">
function addRow(table_Id) {
var table = document.getElementById(table_Id);
var rowCnt = table.rows.length;
var row = table.insertRow(rowCnt);
var RowCell1 = row.insertCell(0);
var e = document.createElement("input");
e.type = "checkbox";
RowCell1.appendChild(e);
var RowCell2 = row.insertCell(1);
RowCell2.innerHTML = rowCnt + 1;
var RowCell3 = row.insertCell(2);
var e2 = document.createElement("input");
e2.type = "text";
RowCell3.appendChild(e2);
}
function deleteRow(table_Id) {
try {
var table = document.getElementById(table_Id);
var rowCnt = table.rows.length;
for(var i=0; i<rowCnt; i++) {
var row = table.rows[i];
var selected_chkbox = row.cells[0].childNodes[0];
if(null != selected_chkbox && true == selected_chkbox.checked) {
table.deleteRow(i);
rowCnt--;
i--;
}
}
}catch(e) {
alert(e);
}
}
</SCRIPT>
</HEAD>
<BODY>
<TABLE id="table_Id" border="1">
<TR>
<TD><INPUT type="checkbox" name="chekbx"/></TD>
<TD> 1 </TD>
<TD> <INPUT type="text" /> </TD>
</TR>
</TABLE>
<INPUT type="button" value="ADD ROW" onclick="addRow('table_Id')" />
<INPUT type="button" value="DELETE ROW" onclick="deleteRow('table_Id')" />
</BODY>
</HTML>
