Hi All,
Welcome back.
This week I am coming with three interesting, super, and so on...
Virtual Keyboard
Hackers, whose primary focus, be it for malicious or beneficial reasons, are weaknesses in computer security. As the techniques are increasing they are simply spreading the virus and worms to attack the security issues of the system. I think, I don't need to explain the job of a Hacker. I want to discuss a security issues by an Hacker. As we are developing web applications in which some of them are Banking, Mailing, Voting or any other else where password have greater importance.
There exits some softwares like Key Logger, System Tracker, keystroke detector which will run in background of the system and maintains a separate log which contains the every key that we type on key board.Usually we can see in some net cafes. It leads to Password Theft. Our System must able to check these applications for this we can use a JavaScript API called Virtual KeyBoard referred from http://www.greywyvern.com/code/javascript/keyboard .
This API will provide a keyboard as we see in Banking Sites or Onscreen Keyboard. It is just a simple Javascript implementation, Easy Plugin... For Example
Username:
Password:
We Can Download for following links
- JavaScript Source code: http://www.greywyvern.com/code/javascript/keyboard.js
- CSS Source code: http://www.greywyvern.com/code/javascript/keyboard.css
- Icon: http://www.greywyvern.com/code/javascript/keyboard.png
Configuration:
Place the following in <head> Tag
<script type="text/javascript" src="keyboard.js"></script>
<link rel="stylesheet" type="text/css" href="keyboard.css">
Define the input field as..
<input type="text" value="" class="keyboardInput">
Dragable and Sortable Tables
In our application we are having some reports like Staff Salary Details, Student Attendance Details, Marks, Revenue and so on.. In these kind of report we need to have compare all the records with other ones. some of them to sort according to some criteria in a single table i.e., In one instance of time we need highest value a top and in another instance we need least value a top.. So the table have to sorted dynamically on user actions..
For this I found a API at http://www.danvk.org. This will provides draggable and Sortable tables..
Here we can re-arrange the tables columns according to our requirement and can be sorted according to specified column.For Examples
Click on the Column Head to sort the table according to that column
| S.No | Name | Subject1 | Subject2 | Subject3 |
|---|---|---|---|---|
| 1 | Raja | 34 | 55656 | 445 |
| 2 | Kiran | 76 | 3434 | 45 |
| 3 | Prasad | 89 | 45656 | 323 |
| 4 | Prem | 12 | 5665 | 676 |
| 5 | Ashok | 87 | 2343 | 7889 |
| 6 | Mohan | 45 | 9898 | 23 |
| 7 | Shyam | 89 | 76878 | 78 |
Source Code:
<script src="sorttable.js"></script>
<script src="dragtable.js"></script>
<table class="draggable sortable">
...
</table>
Download:
- http://www.kryogenix.org/code/browser/sorttable/sorttable.js
- http://www.danvk.org/dragtable/dragtable.js
Captcha
A CAPTCHA is a type of challenge-response test used in computing as an attempt to ensure that the response is generated by a person. The process usually involves one computer (a server) asking a user to complete a simple test which the computer is able to generate and grade. Because other computers are assumed to be unable to solve the CAPTCHA, any user entering a correct solution is presumed to be human. Thus, it is sometimes described as a reverse Turing test, because it is administered by a machine and targeted at a human, in contrast to the standard Turing test that is typically administered by a human and targeted at a machine. A common type of CAPTCHA requires the user to type letters or digits from a distorted image that appears on the screen.
There many no.of application implemented in different languages.Here, I am presenting you a simple Captcha Generator using javascript//
For Example:
Source Code:
If the Example doesnt works please try with below source code...
<html>
<head>
<script type="text/javascript">
function generate()
{
var a = Math.ceil(Math.random() * 9)+ '';
var b = Math.ceil(Math.random() * 9)+ '';
var c = Math.ceil(Math.random() * 9)+ '';
var d = Math.ceil(Math.random() * 9)+ '';
var e = Math.ceil(Math.random() * 9)+ '';
var code = a + b + c + d + e;
document.getElementById("txtCaptcha").value = code;
document.getElementById("txtCaptchaDiv").innerHTML = code;
}
function checkform(theform){
var why = "";
if(theform.txtInput.value == ""){
why += "- Security code should not be empty.\n";
}
if(theform.txtInput.value != ""){
if(ValidCaptcha(theform.txtInput.value) == false){
why += "- Security code did not match.\n";
}
}
if(why != ""){
alert(why);
return false;
}
}
// Validate the Entered input aganist the generated security code function
function ValidCaptcha(){
var str1 = removeSpaces(document.getElementById('txtCaptcha').value);
var str2 = removeSpaces(document.getElementById('txtInput').value);
if (str1 == str2){
return true;
}else{
return false;
}
}
// Remove the spaces from the entered and generated code
function removeSpaces(string){
return string.split(' ').join('');
}
</script>
</head>
<body onload="generate()">
<form id="form3" action="#" method="post" onsubmit="return checkform(this);">
<h3><span>Contact Us</span></h3>
<fieldset>
<legend>Contact form</legend>
<p class="first">
<label for="name">Name</label>
<input type="text" name="name" id="name" size="30" />
</p>
<p>
<label for="email">Email</label>
<input type="text" name="email" id="email" size="30" />
</p>
<p>
<label for="phone">Phone</label>
<input type="text" name="phone" id="phone" size="30" />
</p>
<p>
<label for="code">Write code below > <span id="txtCaptchaDiv" style="color:#F00"></span><!-- this is where the script will place the generated code -->
<input type="hidden" id="txtCaptcha" /></label><!-- this is where the script will place a copy of the code for validation: this is a hidden field -->
<input type="text" name="txtInput" id="txtInput" size="30" />
</p>
</fieldset>
<fieldset class="last">
<p>
<label for="message">Message</label>
<textarea name="message" id="message" cols="30" rows="10"></textarea>
</p>
</fieldset>
<p class="submit">
<button type="submit">Send</button>
</p>
</form>
</body>
</html>
Ok Guys,If the Example doesnt works please try with below source code...
<html>
<head>
<script type="text/javascript">
function generate()
{
var a = Math.ceil(Math.random() * 9)+ '';
var b = Math.ceil(Math.random() * 9)+ '';
var c = Math.ceil(Math.random() * 9)+ '';
var d = Math.ceil(Math.random() * 9)+ '';
var e = Math.ceil(Math.random() * 9)+ '';
var code = a + b + c + d + e;
document.getElementById("txtCaptcha").value = code;
document.getElementById("txtCaptchaDiv").innerHTML = code;
}
function checkform(theform){
var why = "";
if(theform.txtInput.value == ""){
why += "- Security code should not be empty.\n";
}
if(theform.txtInput.value != ""){
if(ValidCaptcha(theform.txtInput.value) == false){
why += "- Security code did not match.\n";
}
}
if(why != ""){
alert(why);
return false;
}
}
// Validate the Entered input aganist the generated security code function
function ValidCaptcha(){
var str1 = removeSpaces(document.getElementById('txtCaptcha').value);
var str2 = removeSpaces(document.getElementById('txtInput').value);
if (str1 == str2){
return true;
}else{
return false;
}
}
// Remove the spaces from the entered and generated code
function removeSpaces(string){
return string.split(' ').join('');
}
</script>
</head>
<body onload="generate()">
<form id="form3" action="#" method="post" onsubmit="return checkform(this);">
<h3><span>Contact Us</span></h3>
<fieldset>
<legend>Contact form</legend>
<p class="first">
<label for="name">Name</label>
<input type="text" name="name" id="name" size="30" />
</p>
<p>
<label for="email">Email</label>
<input type="text" name="email" id="email" size="30" />
</p>
<p>
<label for="phone">Phone</label>
<input type="text" name="phone" id="phone" size="30" />
</p>
<p>
<label for="code">Write code below > <span id="txtCaptchaDiv" style="color:#F00"></span><!-- this is where the script will place the generated code -->
<input type="hidden" id="txtCaptcha" /></label><!-- this is where the script will place a copy of the code for validation: this is a hidden field -->
<input type="text" name="txtInput" id="txtInput" size="30" />
</p>
</fieldset>
<fieldset class="last">
<p>
<label for="message">Message</label>
<textarea name="message" id="message" cols="30" rows="10"></textarea>
</p>
</fieldset>
<p class="submit">
<button type="submit">Send</button>
</p>
</form>
</body>
</html>
Let us meet next week...
regards,
M.Agni
Assistant Professor,
ACE Team member
Aditya Edu. Group.
Ph: 9491520200
Email: agni2020@gmail.com
agnim@aec.edu.in
OOooo cam up vth another new n innovative tips n made us familiar vth deseee...really nic..thnkuu Sir...
ReplyDeletehello sir ,
ReplyDeletei didn't find any resources for dragging and sorting of tables at thr link u provided http://www.danvk.org.
so pls guide me with some other alternative
ReplyDeletePlease go through link
http://www.danvk.org/wp/dragtable/
in same website..
This comment has been removed by the author.
ReplyDeletethank u sir i got it....
ReplyDeletecan u please include some more new features ...
and links to download JS FILES OF "CAPTCHA"