...

View Full Version : I would like to make a form that simply take awy the border on the textbox



dasteinitz
08-21-2002, 08:18 PM
I would like to make a form that simply take away the border on the textbox when submitted so that a form now looks like a text document and can be printed. Below is a silly example of how it could work (how ever it does not). Thank you for any help. Daniel

<html>
<head>
<title>A Very Simple Calculator</title>
<script language = "JavaScript">
<!-- hide me from old browsers
function multiplyTheFields()
{
var number_one = window.document.the_form.field_one.value;
var number_two = window.document.the_form.field_two.value;
window.document.the_form.field_one.border=0; //these are things I have tried and do not work
window.document.the_form.field_two.style='border-style: none';
var product= number_one * number_two;
alert(number_one + " times " + number_two + " is: " + product);
}
// end hiding comment -->
</script>
</head>
<body>
<form name = "the_form">
Number 1: <input type = "text" name = "field_one" border="15"> <br>
Number 2: <input type = "text" name = "field_two" style='border-style: solid'> <br>
<a href="#" onClick = "multiplyTheFields(); return false;">multiply them!</a>
</form>
</body>
</html>

ShriekForth
08-21-2002, 09:06 PM
You can change the class of the object.


<style type="text/css">
.borderOff.{ border-bottom:0px; border-left:0px ; border-right:0px; border-top:0px;}
.borderOn{border-bottom:2px inset #313039; border-left:1px solid #DDDDDD; border-right:2px inset #313039; border-top:1px solid #DDDDDD; color:#000000;}
</style>
<script language = "JavaScript">
function multiplyTheFields()
{
document.the_form.field_one.className = "borderOff";
document.the_form.field_two.className = "borderOff";
}
</script>
</head>
<body>
<form name = "the_form">
Number 1: <input type = "text" name="field_one"class="borderOn" > <br>
Number 2: <input type = "text" name="field_two" class="borderOn"> <br>
<a href="#" onClick = "multiplyTheFields(); return false;">multiply them!</a>


This will work well in IE, you would have to tweak the style shown above to make it look right in Mozilla, or NS 6

ShriekForth

dasteinitz
08-22-2002, 03:14 PM
:) :rolleyes: :rolleyes: :) :D :p :thumbsup:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum