Prevent calling onchange event when checkbox value changes

Question

I would like to prevent triggering the onchange event of selectbooleancheckbox when its value is toggled in toggleBillableChkBox method.

<p:selectBooleanCheckbox value="#{myBean.billableBoolean}" widgetVar="billableEditVar"
    id="billableEdit" onchange="showBillableForEdit(this)">
</p:selectBooleanCheckbox>

function showBillableForEdit(obj){
     if(obj.checked){
        confirmBillableYesEdit.show();
    } else{
        confirmBillableNoEdit.show();
    }
}


<p:confirmDialog id="confirmBYesEditId" header="Please Confirm" severity="alert" visible="false"      
    widgetVar="confirmBillableYesEdit" 
    message="edit Are you sure  you want to invoice this service ?" >
    <p:commandButton value="Yes" oncomplete="confirmBillableYesEdit.hide();" global="false" >
    </p:commandButton>

    <p:commandButton value="No"   onclick="toggleBillableChkBox();"
        oncomplete="confirmBillableYesEdit.hide();">
    </p:commandButton>
</p:confirmDialog>


function toggleBillableChkBox() {
    billableEditVar.toggle();
}

score 1 · Answer 1 · answered Nov 11 '14 at 15:46

1

You can't prevent the event from firing that I know of but you can stop it from doing anything with this code. (this replaces your onclick) in a script tag:

$('#billableEdit').on('change', function( evt ) {
  evt.preventDefault();
  evt.stopPropagation();
  billableEditVar.toggle();
});

answered Nov 11 '14 at 15:46

Gary Storey

1,779
2
14
19

3

a simple `return false` does both `preventDefault` *and* `stopPropagation.` – iCollect.it Ltd Nov 11 '14 at 15:48
@TrueBlueAussie I always do it this way to be safe. See this question http://stackoverflow.com/questions/1357118/event-preventdefault-vs-return-false – Gary Storey Nov 11 '14 at 15:54
The thing to take away from that page you linked is that *in jQuery event handlers* `return false` *always does both*. End of story. Raw JS event handlers... that's another matter entirely :) – iCollect.it Ltd Nov 11 '14 at 15:56
2

@TrueBlueAussie Agreed. I tend to write more plain JS than jQuery which is why I prefer the above. You are 100% correct, for this question, either will work and one line of code is typically better than two. :) – Gary Storey Nov 11 '14 at 16:01
return false didnot work for me..so i just cleared the onchange of the element just before toggling. – mehere Nov 12 '14 at 05:43

score 0 · Accepted Answer · answered Nov 12 '14 at 05:45

0

return false didnot work for me..so i just cleared the onchange of the element just before toggling.

function toggleBillableChkBox() {
   document.getElementById('billableEdit_input').onchange = "";        
   billableEditVar.toggle();
}

answered Nov 12 '14 at 05:45

mehere

1,487
5
28
50

Prevent calling onchange event when checkbox value changes

2 Answers2