function Validation(){
var a=document.getElementById('MyTextBox').value;
var regex1=/^[a-zA-Z][a-zA-Z]*$/;
if(regex1.test(a)== false){
alert('Please enter only Alphabatic ');
MyTextBox.focus();
return false;
}
else {
alert('Accepted ');
}
}
</script>
***************************
<html>
<body>
<INPUT name="MyTextBox" type="text" id="MyTextBox">
<INPUT onClick="Validation();" id=Button1 type=button value="Test
Text!" name=btnTest>
</body>
</html>
[ add comment ] | permalink |
( 3 / 15 )TextBox that accept only Alphanumeric value without any white space.
<script type="text/javascript">
function Validation(){
var a=document.getElementById('MyTextBox').value;
var regex1=/^[a-zA-Z][a-zA-Z0-9]*$/;
if(regex1.test(a)== false){
alert('Please enter aplphanumeric without white Space ');
MyTextBox.focus();
return false;
}
else {
alert('Accepted ');
}
}
</script>
***************************
<html>
<body>
<INPUT name="MyTextBox" type="text" id="MyTextBox">
<INPUT onClick="Validation();" id=Button1 type=button value="Test
" name=btnTest>
</body>
</html>
[ add comment ] ( 1 view ) | permalink |
( 3 / 15 )This is a simple way to validate a textbox that accept only alphanumric value with space.
<script type="text/javascript">
function Validation(){
var a=document.getElementById('MyTextBox').value;
var regex1=/^[a-zA-Z][a-zA-Z0-9 ]*$/; //this is the pattern of regular expersion
if(regex1.test(a)== false){
alert('Please enter aplphanumeric without white Space ');
MyTextBox.focus();
return false;
}
else {
alert('Accepted ');
}
}
</script>
**********************
<html>
<body>
<INPUT name="MyTextBox" type="text" id="MyTextBox">
<INPUT onClick="Validation();" id=Button1 type=button value="Test
" name=btnTest>
</body>
</html>
[ add comment ] ( 1 view ) | permalink |
( 3.1 / 16 )Here two page one is select.php and another is view.php, in view.php we diplay the array elements from moved items in second ListBox from page Select.php.
// Select.php //
****************
<script type="text/javascript">
function goto(path) {
window.location.href = path;
}
function fnMoveItems(lstbxFrom,lstbxTo)
{
var varFromBox = document.frm.elements[lstbxFrom];
var varToBox = document.frm.elements[lstbxTo];
if ((varFromBox != null) && (varToBox != null))
{
if(varFromBox.length < 1)
{
alert('There are no items in the source ListBox');
return false;
}
if(varFromBox.options.selectedIndex == -1) // when no Item is selected the index will be -1
{
alert('Please select an Item to move');
return false;
}
while ( varFromBox.options.selectedIndex >= 0 )
{
var newOption = new Option(); // Create a new instance of ListItem
newOption.text = varFromBox.options[varFromBox.options.selectedIndex].text;
newOption.value = varFromBox.options[varFromBox.options.selectedIndex].value;
varToBox.options[varToBox.length] = newOption; //Append the item in Target Listbox
varFromBox.remove(varFromBox.options.selectedIndex); //Remove the item from Source Listbox
}
}
return false;
}
function mydata()
{
var sel="";
var obj;
var j;
obj=document.frm.RightBox1;
for(j=0;j<obj.options.length;j++) {
sel+=obj.options[j].value+":";
}
document.frm.selected1.value=sel;
}
</script>
************************
<html>
<body>
<form name="frm" method="post" action="view.php" onSubmit=" return mydata();">
<br/>
<table width="42%" border="0" cellspacing="1" cellpadding="0">
<tr>
<th width="19%" scope="row"><select name="LeftBox1" size="4" multiple style ="text-transform:capitalize;width:140px;">
<option value="First Select">First Select</option>
<option value="Second select">Second Select</option>
<option value="Second select">Third Select</option>
<option value="Second select">Forth Select</option>
</select></th>
<td width="7%"><input type = "button" value = ">>" onclick = "fnMoveItems('LeftBox1','RightBox1')"; />
<input type = "button" value = "<<" onclick = "fnMoveItems('RightBox1','LeftBox1')"; /></td>
<td width="74%"><select name="RightBox1" size="4" multiple style ="text-transform:capitalize;width:140px;">
<option></option>
</select>
<input type="hidden" name="selected1" value="">
<input type="submit" name="button1" value="Get Value" /></td>
</tr>
</table>
</form>
</body>
</html>
// View.php page //
********************
<?php
$view=$_REQUEST['selected1'];
$array1=explode(":", $view);
print "<pre>";
print_r($array1);
print "</pre>";
?>
[ add comment ] ( 3 views ) | permalink |
( 3 / 16 )To retrive itmes from a PHP array to a ListBox and display that.
<?php
$items = array('country' => array(1 => 'India',
2 => 'Pakistan',
3 => 'England',
4 =>'Japan',
));
$tm1 = &$items['country'];
$i=0;
?>
*************
<html>
<body>
<form>
<select name="select1" size="5">
<? foreach ($tm1 as $k => $v) { ?>
<option value="<?= $k?>"><?= $v?></option>
<?
}
?>
</select>
</form>
</body>
</html>
[ add comment ] ( 1 view ) | permalink |
( 3.1 / 16 )To View a good example, Just copy and paste this code in html format and run it.
<script type="text/javascript">
function goto(path) {
window.location.href = path;
}
function fnMoveItems(lstbxFrom,lstbxTo)
{
var varFromBox = document.frm.elements[lstbxFrom];
var varToBox = document.frm.elements[lstbxTo];
if ((varFromBox != null) && (varToBox != null))
{
if(varFromBox.length < 1)
{
alert('There are no items in the source ListBox');
return false;
}
if(varFromBox.options.selectedIndex == -1) // when no Item is selected the index will be -1
{
alert('Please select an Item to move');
return false;
}
while ( varFromBox.options.selectedIndex >= 0 )
{
var newOption = new Option(); // Create a new instance of ListItem
newOption.text = varFromBox.options[varFromBox.options.selectedIndex].text;
newOption.value = varFromBox.options[varFromBox.options.selectedIndex].value;
varToBox.options[varToBox.length] = newOption; //Append the item in Target Listbox
varFromBox.remove(varFromBox.options.selectedIndex); //Remove the item from Source Listbox
}
}
return false;
}
</script>
*************************
<html>
<body>
<form name="frm">
<br/>
<table width="42%" border="0" cellspacing="1" cellpadding="0">
<tr>
<th width="19%" scope="row"><select name="LeftBox1" size="15" multiple style ="text-transform:capitalize;width:140px;">
<option value="First Select">First Select</option>
<option value="Second select">Second Select</option>
<option value="Second select">Third Select</option>
<option value="Second select">Forth Select</option>
</select></th>
<td width="7%"><input type = "button" value = ">>" onclick = "fnMoveItems('LeftBox1','RightBox1')"; />
<input type = "button" value = "<<" onclick = "fnMoveItems('RightBox1','LeftBox1')"; /></td>
<td width="74%"><select name="RightBox1" size="15" multiple style ="text-transform:capitalize;width:140px;">
<option></option>
</select></td>
</tr>
</table>
</form>
</body>
</html>
[ add comment ] ( 1 view ) | permalink |
( 3 / 16 )To view the example just copy and paste this code in your html page.
<script language="javascript">
function ListBox1_DoubleClick() {
document.getElementById('ListBox1Hidden').innerHTML = document.frm1.select1.value;
}
</script>
*******************
<html>
<body>
<form name="frm1" >
<select name="select1" size="3" onchange="ListBox1_DoubleClick();">
<option value="First Select">First Select</option>
<option value="Second select">Second Select</option>
</select>
<div id="ListBox1Hidden" />
</form>
</body>
</html>
[ add comment ] ( 1 view ) | permalink |
( 3 / 21 )For making HTML pages always create the following folders:
img
css
js
img = All Images should go in img folder.
css = All css files should go in css folder.
js = All Javascript should go to js folder.
There SHOULD NOT BE any CSS or JavaScript Code in the HTML Page.
[ add comment ] ( 3 views ) | permalink |
( 2.4 / 29 )Javascript code to go to page
Path = URL to goto
function goto(path) {
window.location.href = path;
}
to call:
<script type='text/Javascript'>goto('screen2.php');</script>
[ add comment ] ( 1 view ) | permalink |
( 3 / 20 )This function performs Textbox Validation using Javascript
function validate_form1()
{
valid = true;
if ( document.frm.username.value == "" ) {
alert( "User Name Should Not be Empty." );
document.frm.username.focus();
valid = false;
return valid;
}
if ( document.frm.password.value == "" ) {
alert( "Password Should Not be Empty." );
document.frm.password.focus();
valid = false;
return valid;
}
return valid;
}
[ add comment ] ( 2 views ) | permalink |
( 3 / 21 )
Calendar
