SBonfiglio
IS-IT--Management
A very weird things are happening to me.
1. If I change the class of an Input Text field the value of the field is put at 0. So it seems that I have to save the value before changing the class, then I have to restore it.
2. It seems that it is impossible to change the CSS class again back to "class0" if the value goes back to zero again. The class remains "nonzerovalue"
This is the code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
<!--
.zerovalue {
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
font-weight: bold;
color: #666;
text-decoration: none;
background-color: #CCC;
text-align: right;
}
.nonzerovalue {
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
font-weight: bold;
color: #000;
text-decoration: none;
background-color: #FFC;
text-align: right;
}
.smallbutton {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000;
background-color: #DDD;
text-align: center;
vertical-align: middle;
height: 15px;
width: 15px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #EEE;
border-right-color: #666;
border-bottom-color: #666;
border-left-color: #EEE;
}
-->
</style>
<script language="javascript">
<!--
function modify(textinput,action){
var obj=document.getElementById(textinput);
var v = obj.value;
if(action=="add"){
obj.value++;
if(obj.value>99){
obj.value=99;
}
} else {
obj.value--;
if(obj.value<0){
obj.value=0;
}
}
v = obj.value;
if(obj.value=0) {
obj.className = 'zerovalue';
} else {
obj.className = 'nonzerovalue';
}
obj.value = v;
}
//-->
</script>
</head>
<body>
<h3>TEST OF CHANGING CSS STYLE ON VALUE </h3>
<form id="form1" name="form1" method="post" action="">
<h4>DESCRIPTION
<input name="L00100" id="L00100" type="text" class="zerovalue" value="0" size="2" maxlength="2" />
<input name="B00100sub" id="B00100sub" type="button" class="smallbutton" onClick="modify('L00100','sub');" value="-" />
<input name="B00100add" id="B00100add" type="button" class="smallbutton" onClick="modify('L00100','add');" value="+" />
</h4>
</form>
</body>
</html>
1. If I change the class of an Input Text field the value of the field is put at 0. So it seems that I have to save the value before changing the class, then I have to restore it.
2. It seems that it is impossible to change the CSS class again back to "class0" if the value goes back to zero again. The class remains "nonzerovalue"
This is the code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
<!--
.zerovalue {
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
font-weight: bold;
color: #666;
text-decoration: none;
background-color: #CCC;
text-align: right;
}
.nonzerovalue {
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
font-weight: bold;
color: #000;
text-decoration: none;
background-color: #FFC;
text-align: right;
}
.smallbutton {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000;
background-color: #DDD;
text-align: center;
vertical-align: middle;
height: 15px;
width: 15px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #EEE;
border-right-color: #666;
border-bottom-color: #666;
border-left-color: #EEE;
}
-->
</style>
<script language="javascript">
<!--
function modify(textinput,action){
var obj=document.getElementById(textinput);
var v = obj.value;
if(action=="add"){
obj.value++;
if(obj.value>99){
obj.value=99;
}
} else {
obj.value--;
if(obj.value<0){
obj.value=0;
}
}
v = obj.value;
if(obj.value=0) {
obj.className = 'zerovalue';
} else {
obj.className = 'nonzerovalue';
}
obj.value = v;
}
//-->
</script>
</head>
<body>
<h3>TEST OF CHANGING CSS STYLE ON VALUE </h3>
<form id="form1" name="form1" method="post" action="">
<h4>DESCRIPTION
<input name="L00100" id="L00100" type="text" class="zerovalue" value="0" size="2" maxlength="2" />
<input name="B00100sub" id="B00100sub" type="button" class="smallbutton" onClick="modify('L00100','sub');" value="-" />
<input name="B00100add" id="B00100add" type="button" class="smallbutton" onClick="modify('L00100','add');" value="+" />
</h4>
</form>
</body>
</html>
