0

Now my goal is to show an alert if all of my checkboxes are checked. Now I tried researching about it but all I can see is if the checkbox is in <input type="checkbox"> instead of <apex:inputCheckbox>. So how Can i call the <apex:inputCheckbox> in the javascript function?

I tried this but it does not work

    <script>
function checker(){
if(document.getElementbyID('cb1').value==true && document.getElementbyID('cb2').value==true){
                    alert('You can only click one field to lock');
                }
            }
}
</script>
  • This question does not really appear to be specific to Salesforce and belongs on Stack Overflow instead of SFSE. – Adrian Larson Oct 19 '16 at 15:37
  • Also, if you want to enforce only one selection, <apex:selectRadio> seems a much more appropriate tag... – Adrian Larson Oct 19 '16 at 15:38
  • @AdrianLarson It would be, except you can't place the radio anywhere you like (e.g. inside each row in a dataTable). If we could place them as we needed, it'd be a lot more useful. Unless you know of a way to do that? – sfdcfox Oct 19 '16 at 16:04
  • I've never needed to use it, personally. Just seemed like an obvious choice. I didn't know of those limitations. – Adrian Larson Oct 19 '16 at 16:08
2

The "id" attribute is a magic value that's kind of hard to rely on. These days, I usually prefer to set a custom data attribute to key off of. Here's a simple way to do this:

<apex:page >
    <apex:form>
        <script>
            function check() {
                if(document.querySelectorAll('[data-single]:checked').length===2) {
                    alert('choose only 1');
                }
            }
        </script>
        <apex:inputCheckbox html-data-single="" onchange="check()" />
        <apex:inputCheckbox html-data-single="" onchange="check()" />
    </apex:form>
</apex:page>

Feel free to adjust as necessary.

| improve this answer | |
1

Visualforce provides components that are expanded into blocks of HTML on the server and the resulting HTML page is passed to the browser. So as soon as you add JavaScript logic that runs in the browser, you have to start relying on the details of this conversion.

For example, id values that you set in Visualforce have the id values of the parent elements prefixed. You can use your browser's "Inspect" or "View Source" features to see what ends up in the page and develop your JavaScipt accordingly.

But it is safest to start out doing validation in your Apex controller which is how Visualforce is designed to be used. Only move to JavaScript if you have a good reason.

| improve this answer | |

Not the answer you're looking for? Browse other questions tagged or ask your own question.