Posts

Showing posts from May, 2012

Jquery Table Sorter

-
To use the tablesorter plugin, include the   jQuery   library and the tablesorter plugin inside the   <head>   tag of your HTML document: <script type="text/javascript" src="/path/to/jquery-latest.js"></script> <script type="text/javascript" src="/path/to/jquery.tablesorter.js"></script>   Tablesorter works on standard HTML tables. You must include THEAD and TBODY tags: <table id="myTable" class="tablesorter"> <thead> <tr>     <th>Last Name</th>     <th>First Name</th>     <th>Email</th>     <th>Due</th>     <th>Web Site</th> </tr> </thead> <tbody> <tr>     <td>Smith</td>     <td>John</td>     <td>jsmith@gmail.com</td>     <td>$50.00</td>     <td>http://www.jsmith.com</td> </tr> <tr>     <td>B
Post a Comment
Read more

Using Cookies with PHP

-
A cookie is set with the following code: setcookie(name, value, expiration) <?php $Month = 2592000 + time(); //this adds 30 days to the current time setcookie(AboutVisit, date("F jS - g:i a"), $Month); ?>      The above code sets a cookie in the visitor's browser called "AboutVisit". The cookie sets the value to the current date , and set's the expiration to be be in 30 days (2592000 = 60 seconds * 60 mins * 24 hours * 30 days.) Now let's retrieve the cookie. <?php  if(isset($_COOKIE['AboutVisit'])) {  $last = $_COOKIE['AboutVisit'];  echo "Welcome back! <br> You last visited on ". $last;  } else {   echo "Welcome to our site!";   }   ?>   This code first checks if the cookie exists. If it does, it welcomes the user back and tells them when they last visited. If they are new, it skips this and prints a generic welcome message. TIP:   If you are calling a cooking on the same pag
1 comment
Read more

Fading effect to Html popup

-
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script type='text/javascript'> // Browser safe opacity handling function function setOpacity( value ) {  document.getElementById("styled_popup").style.opacity = value / 10;  document.getElementById("styled_popup").style.filter = 'alpha(opacity=' + value * 10 + ')'; } function fadeInMyPopup() {  for( var i = 0 ; i <= 100 ; i++ )    setTimeout( 'setOpacity(' + (i / 10) + ')' , 8 * i ); } function fadeOutMyPopup() {  for( var i = 0 ; i <= 100 ; i++ ) {    setTimeout( 'setOpacity(' + (10 - i / 10) + ')' , 8 * i );  }  setT
Post a Comment
Read more

Regex password validation in javascript

-
In this first example, the password must be at least 8 characters long and start and end with a letter.  var  re = /^[A-Za-z]\w{6,}[A-Za-z]$/; if  (!re.test(myString)) { alert( "Please enter a valid password!" ); } In this second example, the password length doesn't matter, but the password must contain at least 1 number, at least 1 lower case letter, and at least 1 upper case letter.  var  re = /^\w*(?=\w*\d)(?=\w*[a-z])(?=\w*[A-Z])\w*$/ if  (!re.test(myString)) { alert( "Please enter a valid password!" ); } Password Regular Expression Pattern is as follows: ( ( ?= . * \d ) ( ?= . * [ a - z ] ) ( ?= . * [ A - Z ] ) ( ?= . * [ @#$ % ] ) . { 6 , 20 } ) Explanation : ( # Start of group ( ?= . * \d ) # must contains one digit from 0 - 9 ( ?= . * [ a - z ] ) # must contains one lowercase characters ( ?= . * [ A - Z ] ) # must contains one uppercase characters ( ?= . * [ @#$ % ] ) # must contains one special symbols in the
Post a Comment
Read more

Add and delete columns dynamically in an HTML table

-
To add new rows to a table (or table section) you can use insertRow, but there isn't an equivalent insertColumn in the  DOM table methods . So what you can do is iterate the rows in the table (or table section), and call insertCell for each row. Javascript:   tableaddcolumn.js // 2006-08-21 - Created // 2006-11-05 - Modified - head and body function addColumn(tblId) { var tblHeadObj = document.getElementById(tblId).tHead; for (var h=0; h<tblHeadObj.rows.length; h++) { var newTH = document.createElement('th'); tblHeadObj.rows[h].appendChild(newTH); newTH.innerHTML = '[th] row:' + h + ', cell: ' + (tblHeadObj.rows[h].cells.length - 1) } var tblBodyObj = document.getElementById(tblId).tBodies[0]; for (var i=0; i<tblBodyObj.rows.length; i++) { var newCell = tblBodyObj.rows[i].insertCell(-1); newCell.innerHTML = '[td] row:' + i + ', cell: ' + (tblBodyObj.rows[i].cells.length - 1) } } function deleteColumn(tblId) { v
1 comment
Read more

Add and delete rows dynamically in an HTML table

-
Explanation A row is inserted at the end of the table using the  insertRow  method, and two cells are added. One cell has just text, and the other cell has an HTML input. There is more than one way to accomplish this. The technique here uses  document.createTextNode  and  document.createElement  to create the text and HTML input, respectively. If you enter text into the text boxes, they are not affected when new rows are added. Each row gets a unique name, so if the values are being submitted to a server-side page, it can look for txtRow1, txtRow2, etc. The Remove button deletes the last row using table method  deleteRow . The JavaScript does a check to prevent the header or first row from being deleted. The JavaScript // Last updated 2006-02-21 function addRowToTable() { var tbl = document.getElementById('tblSample'); var lastRow = tbl.rows.length; // if there's no header row in the table, then iteration = lastRow + 1 var iteration = lastRow; var row = tbl.i
Post a Comment
Read more