04.18.08
form validaton for radio buttons with javaScript
var radioVal;
var radioLength = document.userform.radioName.length;
//first check if the form has a single radio, if we do not provide this, will get a problem with single radio
if(radioLength == undefined)
{ if(document.userform.radioName.checked)
radioVal = document.userform.radioName.value;
}
else
{
// if form has more than one radio buttons
for(var iCounter=0; iCounter<document.userform.radioName.length; iCounter++)
{
if(document.userform.radioName[iCounter].checked)
{ radioVal = document.userform.radioName[iCounter].value; }
}
}
//if radio is not selected provide validation like below
if( radioVal == null ){
alert(“Please Select a File”);
}
04.17.08
about Z-index property of div styles
we have a bug in netscape browser with positioning. It works great in Firefox and IE. But when it comes to Netscape which div is on top is matters.
Here is a simple Example to manipulate with Z-index:
<html>
<head><style type=”text/css”>
div {
opacity: 0.7;
font: 12px Arial;
}
span.bold { font-weight: bold; }
#div5 {
z-index: 8;
height: 70px;
border: 1px dashed #999966;
background-color: #ffffcc;
margin: 0px 50px 0px 50px;
text-align: center;
}
#div3 {
z-index: 3;
height: 100px;
position: relative;
top: 30px;
border: 1px dashed #669966;
background-color: white;
margin: 0px 50px 0px 50px;
text-align: center;
}
#div4 {
z-index: 2;
height: 100px;
position: relative;
top: 15px;
left: 20px;
border: 1px dashed #669966;
background-color: green;
margin: 0px 50px 0px 50px;
text-align: center;
}
#div1 {
z-index: 5;
position: absolute;
width: 150px;
height: 350px;
top: 10px;
left: 10px;
border: 1px dashed #990000;
background-color: white;
text-align: center;
}
#div2 {
z-index: 1;
position: absolute;
width: 150px;
height: 350px;
top: 10px;
right: 10px;
border: 1px dashed #990000;
background-color: white;
text-align: center;
}
</style></head>
<body>
<br /><br />
<div id=”div1″>
<br /><span class=”bold”>DIV #1</span>
<br />position: absolute;
<br />z-index: 5;
</div>
<div id=”div3″>
<br /><span class=”bold”>DIV #2</span>
<br />position: relative;
<br />z-index: 3;
</div>
<div id=”div4″>
<br /><span class=”bold”>DIV #3</span>
<br />position: relative;
<br />z-index: 2;
</div>
<div id=”div2″>
<br /><span class=”bold”>DIV #4</span>
<br />position: absolute;
<br />z-index: 1;
</div>
<div id=”div5″>
<br /><span class=”bold”>DIV #5</span>
<br />no positioning
<br />z-index: 8;
</div>
</body></html>
04.12.08
methi parata
2 cups whole-wheat flour
1 cup fenugreek leaves washed and patted dry
1/2 cup chopped onions
1 tbsps vegetable oil
1 tsp cumin seeds
1/2 tsp turmeric powder
1/2 tsp red chilli powder
Salt to taste
PREPARATION:
1) Put the flour, fenugreek, onions, 1 tbsp of cooking oil, cumin seeds, turmeric and red chilli powders and salt into mixing bowl.
2) Add a little water to this mixture, and prepare dough like normal chapathi’s.
3) Keep aside for 30 minutes.
4) make small balls and then press it.
5) Heat a griddle and fry the parathas with littile oil.
6)Serve with chilled yogurt and your favorite pickle or chutney.
04.08.08
debugging shortcuts in eclipse
f6 – line by line debugging
f8 – breakpoint to breakpoint debugging
f5 – to debug a method of another class that is using in this debug class
f3 – use this on a method it opens the corresponding method. (just like reference)
04.07.08
Menu bar Example using js & css
need three files
1) menubar.html
2) menu.js
3) menu.css
/* menu.js */
function menu(d){
d.className=’hvr’;
}
function menuOut(d){
d.className=”;
}/* menu.css */
#menuwrapper {
border-top: 1px solid #000;
border-bottom: 1px solid #333;
background-color: white;
border-left: 1px solid #333;
float:left;
}
#menubar, #menubar ul {
padding: 0;
margin: 0;
list-style: none;
}
#menubar a {
display: block;
text-decoration: none;
padding: 5px 10px 5px 10px;
border-right: 1px solid #333;
color: black;
}
#menubar li {
float: left;
width: 9em;
}
#menubar li ul, #menubar ul li {
width: 5em;
}
#menubar li ul {
position: absolute;
display: none;
background-color: #FFFFFF;
border-right: 1px solid #333333;
border-bottom: 1px solid #333333;
}
#menubar li.hvr ul {
display: block;
}
#menubar li.hvr a{
color: black;
background-color: lightblue;
}
#menubar li.hvr ul a{
color: black;
background-color: transparent;
}
#menubar ul li a.reads {
color: lightgrey;
background-color: transparent;
}
#menubar ul a.reads:hover {
background-color: lightblue!important;
color: white!important;
}
#menubar ul a:hover {
background-color: lightblue!important;
color:black!important;
}
#menubar li {width: auto;}
/* menubar.html */
<html>
<head>
<link rel=”stylesheet” type”text/css” href=”menu.css” />
<script type=”text/javascript” src=”menu.js”></script>
</head>
<body >
<div id=”menuwrapper” >
<ul id=”menubar” >
<li onmouseover=”menu(this)” onmouseout=”menuOut(this)”><a href=”#” >Home</a></li>
<li onmouseover=”menu(this)” onmouseout=”menuOut(this)”><a href=”#” >Trigger One</a>
<ul>
<li><a href=”#” >Sub 1.1</a></li>
<li><a href=”#” class=”reads” >Sub 1.2</a></li>
<li><a href=”#”>Sub 1.3</a></li>
<li><a href=”#”>Sub 1.4</a></li>
</ul>
</li>
<li onmouseover=”menu(this)” onmouseout=”menuOut(this)”><a href=”#” >Trigger Two</a>
<ul>
<li><a href=”#”>Sub 2.1</a></li>
<li><a href=”#”>Sub 2.2</a></li>
<li><a href=”#”>Sub 2.3</a></li>
<li><a href=”#”>Sub 2.4</a></li>
<li><a href=”#”>Sub 2.5</a></li>
</ul>
</li>
<li onmouseover=”menu(this)” onmouseout=”menuOut(this)”><a href=”#” >Trigger Three</a>
<ul>
<li><a href=”#”>Sub 3.1</a></li>
<li><a href=”#” class=”reads”>Sub 3.2</a></li>
<li><a href=”#”>Sub 3.3</a></li>
<li><a href=”#”>Sub 3.4</a></li>
<li><a href=”#”>Sub 3.5</a></li>
<li><a href=”#”>Sub 3.6</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>
