How to set disable for p:commandLink with JavaScript?

[Andrew Progash]

How to set disable for p:commandLink with JavaScript?

If don't tick the box, I will not allow click button and redirect to other page.
I try to set disable by the following:

  <script type="text/javascript">

 function Agree() {
     
     var cb1 = document.getElementById('dataform:agree');
     var b1 = document.getElementById('dataform:b1');


     if (cb1.checked) {


     } else {
        jQuery('#b1').click().disabled()=true;
        document.getElementById('dataform:b1').click().disabled=true;
        document.getElementById('dataform:b1').onclick="return false";
        document.getElementById('dataform:b1').disabled=true;
        b1.setAttribute('onclick', 'return false;');
        b1.disabled=true;
        b1.readOnly=true;
        b1.setAttribute('disabled', "true");
        b1.disabled="true";
        document.getElementById('dataform:b1').onclick = function() { return false; };

     }
   }
</script>
<table style="width: 100%; height: 25px; background-color:none" border="0" cellspacing="0" cellpadding="0">
                      <tr style="padding-lefy:20px;">
                      <td>
                       <h:selectBooleanCheckbox value="agree" id="agree" onchange="Agree()" />  I agree.
                      </td>
                      </tr>
 <tr>
                        <td height="25" style="background-image:none; padding-left:20px; padding-right:20px; padding-top:2px; padding-bottom:0px" align="left">
                             <p:commandLink actionListener="#{admissionMBean.goStep1}" id="b1" ><img src="#{request.contextPath}/images/button_previous.png" width="80" height="20" border="0" /></p:commandLink>
                        </td>
                      </tr>
</table>

but not successful.

Thank you.

[Tim Holloway]

First, I recommend not using raw HTML in JSF View definitions. Instead of a TABLE and its elements, use an h:panelGrid. It's usually less coding, it integrates better with JSF, and you only have to work in one language instead of two.

Secondly, manipulation of the "rendered", "disabled" and "readonly" attributes of JSF controls can be tricky, because the JSF renderer may not have included all of the items you require in order to reliably toggle their values.

You are better off attaching an AJAX event to the checkbox with a "render" option that updates the b1 control. Make the b1 control's "disabled" attribute a backing bean property reference (EL expression), and make the AJAX server-side code flip that "disabled" property's value.