Kissingfish wrote:
UPDATE..
I've created the following:
<script language="JavaScript"><!--
That's a backward step. You've replaced the required type attribute
with the deprecated language attribute - and kept the
(worthless/useless/annoying) HTML comment delimiter:
<script type="text/javascript">
function setField1(what) {
if (what.myTick1.checked)
what.myText1.value = '4';
else
what.myText1.value = '';
}
//--></script>
<script language="JavaScript"><!--
Functions can be in the same script element, there is no need to
separate them. You only need one function that you pass a reference to
the checkbox and and the name of the form control to update. The
function could be:
function setField(el, controlName){
el.form.elements[controlName].value = (el.checked)? el.value : '';
}
See below for the call...
[...]
<input type="text" name="myText4" />
Forget pretend XHTML, use HTML. Much of the HTML seems superfluous -
keep posted code concise.
<br/>
<input type="radio" name="myTick1" onClick="setField1(this.form)">
<input type="checkbox" onclick="setField(this, 'text1')">
I'm totally over the whole 'my...' thing.
<input type="text" name="myText1"><br />
<input type="text" name="text1"><br>
<input type="radio" name="myTick2" onClick="setField2(this.form)">
<input type="text" name="myText2"><br />
<input type="radio" name="myTick3" onClick="setField3(this.form)">
<input type="text" name="myText3"<br />
The way to create a set of radio buttons where only one of the set is
checked is to give them all the same name. Individual radio buttons
can't be unchecked without script or re-setting the form.
If you want elements that can be checked/unchecked independently, use
checkboxes.
<INPUT TYPE="BUTTON" VALUE="=" onClick="this.form.answer.value =
(this.form.myText1.value - 0) + (this.form.myText2.value - 0) +
(this.form.myText3.value - 0) + (this.form.myText4.value - 0)">
<INPUT TYPE="TEXT" NAME="answer">
I would use a 'sumFields' function like:
function sumFields(){
var args = arguments;
var f = args[0];
var sum = 0;
for (var i=1, len=args.length; i<len; i++){
sum += +f[args[i]].value;
}
return sum;
}
And make the onclick something like:
<input type="button" value="=" onclick="
this.form.answer.value = sumFields(this.form, 'text1', 'text2',
'text3');
">
<br />
</form>
It just seems messy, but (almost) does what I need it to..
The radio buttons .. They stay on all the time.. And they don't alter
from one to the next (I'm assuming this is because they have different
names assigned to each)..
Yes
IS there a workaroudn for this?
Yes...
Can I name them each the same, but assign them different values?
Yes, that's the 'work around'.
I assume the javascript will need to differ then..
Yes.
Since this appears to be purely for play, here's an example based on
your attempt:
<script type="text/javascript">
function setField(el, controlName){
el.form.elements[controlName].value = (el.checked)? el.value : '';
}
function sumFields(){
var args = arguments;
var f = args[0];
var sum = 0;
for (var i=1, len=args.length; i<len; i++){
sum += +f[args[i]].value;
}
return sum;
}
</script>
<form name="f" action="">
<input type="checkbox" value="4" name="tick1"
onclick="setField(this, 'text1')">
<input type="text" name="text1">
<br>
<input type="checkbox" value="2" name="tick2"
onclick="setField(this, 'text2')">
<input type="text" name="text2">
<br>
<input type="checkbox" value="5" name="tick3"
onclick="setField(this, 'text3')">
<input type="text" name="text3">
<br>
<!-- wrapped for posting -->
<input type="button" value="=" onclick="
this.form.answer.value =
sumFields(this.form, 'text1', 'text2', 'text3');
">
<input type="text" name="answer"><br>
</form>
--
Rob