Click to See Complete Forum and Search --> : use icons to to control a script


seahorse32
11-25-2003, 03:59 PM
This is what I have and would like to change the words to the gif icon. I would like to combine the two buttons into one so that one click turns it "on" and clicked again turns it off and so on.
<form method="POST">
<p><input type="hidden" name="control_device" value="bedroom bed light=on"> <input
type="submit" value="Bedroom Light" name="control_device"></p>
</form>
<form method="POST">
<p><input type="hidden" name="control_device" value="bedroom bed light=off"> <input
type="submit" value="Bed Lights Off" name="control_device"></p>
</form>

PunkSktBrdr01
11-25-2003, 06:04 PM
For this you would need JavaScript. Something like:


<html>
<head>
<title>Test Page</title>
<script type="text/javascript">
function toggleLight() {
var light = document.getElementById('light').value;
var controller = document.getElementById('controller').value;
if (light == "on") {
light = "off"
controller = "Turn the light on!";
}
else {
light = "on";
controller = "Turn the light off!";
}
}
</script>
</head>
<body>
<form method="post">
<input id="light" type="hidden" name="light" value="off">
<input id="controller" type="button" name="controller" value="Turn the light on!" onClick="toggleLight();">
<input type="submit" name="submit" value="Submit!">
</form>
</body>
</html>

seahorse32
11-29-2003, 11:31 AM
This gives me the on and off buttons that work and shows an icon that when clicked or double clicked changes from an on light bulb to an off light bulb.
I would like to see the two combined to that all I see is the light bulb icon. When it is clicked it caused the on off script to work.
If this is impossible can a gif picture be assigned to the face of the button instead of the words "bedroom light".
This is to work with Homeseer a home automation software.



<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 1</title>
</head>

<body>

<form method="POST">
<p><input type="hidden" name="control_device" value="bedroom bed light=on"> <input
type="submit" value="Bedroom Light" name="control_device"></p>
</form>
<form method="POST">
<p><input type="hidden" name="control_device" value="bedroom bed light=off"> <input
type="submit" value="Bed Lights Off" name="control_device"></p>
</form>
<font face="verdana, arial, helvetica" size="2"><input name="B1" type="image"
src="light_on.gif" onclick="B1.src='light_off.gif'"else
ondblclick="B1.src='light_on.gif'" width="25" height="32"></font>

</body>

</html>

The form section works although if they can be combined to work with one button, maybe click and double click it would be better.
Secondly change the face of the one button to a picture or icon as in the script below the form.

Thanks for your help
seahorse32