onClick Event

[Patdundee]

Hi Guys

I am not sure how to put the code into this post so i will have to do it direct

I have a little problem here.

Using onClick
On a checkbox wrapped in a div I have an onClick event in the checkbox which changes it from unChecked to Checked and this works fine and it change the checkbox propertes from

<checkbox id="somename" name="somename" value="somevalue" onClick"callProcedureA"
to
<checkbox id="somename" name="somename" value="somevalue" checked="checked" onClick"callProcedureB">

The problem is even though the properties have changed (This can be seen when i view the source) It is not actually live unless I refresh the page

Here is the code used

function changeContentA(id,shtml) {
if (document.getElementById || document.all) {
var el = document.getElementById? document.getElementById(id): document.all[id];
if (el && typeof el.innerHTML != "undefined") el.innerHTML = shtml;
}
}
var msga = "<input type=\"checkbox\" value=\"'value'\" id=\"vunbook\" name=\"vunbook\" checked=\"checked\" onClick=changeContentB (\'vadiv',msgb')\" />"


function changeContentb(id,shtml) {
if (document.getElementById || document.all) {
var el = document.getElementById? document.getElementById(id): document.all[id];
if (el && typeof el.innerHTML != "undefined") el.innerHTML = shtml;
}
}
var msgb = "<input type=\"checkbox\" value=\"'value'\" id=\"vbook\" name=\"vbook\" onClick=changeContentA (\'vadiv',msga')\" />"



Here is the checkbox before procedure called

<input type="checkbox" onClick="changeContentA('vadiv',msga);" value="'value'" id="vbook'" name="vbook"/>

ad then after

<input type="checkbox" value="'value'" id="vunbook'" name="vunbook" checked="checked" onClick="changeContentb('vadiv',msgb);"/>

So it all works fine. But when you click again it will not change back again.

Any ideas would be greatly apprecoated.

[holyhttp]

You just want to call one or the other function when the checkbox is ticked or not.

How about:
<input type="checkbox" onChange="changeContent('vadiv');" value="'value'" id="vbook'" name="vbook"/>


function changeContent(id){
if(document.getEmelentById('vook').checked=='checked'){
//what need to be accomplished if box ticked
...
}
else{
//what need to be accomplished if checkbox is unticked
...
}

}

I see no reason to use two functions changeContentA and changeContentB to change the content of the element "vadiv" into another checkbox.

[Patdundee]

Hi holyhttp
That makes sense, I will give that a try later today. I think i will also need to include Ajax as when a check box is ticked it will also need to update a value in a box. I am sure there is a Javascript for that one which I have used before. One box is the total and all others will be prices and as they tick certain boxes or remove ticks the total changes.

Many thanks