Able to Hide Checkboxes in Preview, but not in Deployment

MatthewK · August 29, 2023

Hello, I'm having a mysterious problem where my code to hide checkboxes, exes, and the bulk delete link is working in the DataPage Preview but not when deployed using .NET to SharePoint. The SharePoint page where this DataPage is being deployed has 3 other DataPages on it, however other rules and scripts are running without issue on the same SharePoint page. I've also tried deploying this DataPage to a blank SharePoint page template and still can't get it to work. For some reason, the script on this specific DataPage just isn't running. This is a 'Results' DataPage

Here's the script in the footer of the DataPage. I've tried building my lockstatus variable two ways. First, I created a Calculated field that uses SQL to pull the LockStatus of a Program. In an attempt to troubleshoot, I secondarily tried to set my lockstatus variable off an external parameter called 'LockStatus'. Both methods work without issue when Previewing, but fail when deployed.

Here's what I don't understand: if I deploy this DataPage as an iframe to SharePoint, THE SCRIPT WORKS! But, I have other challenges with the iframe that I can't get around, like it only displaying in mobile mode because I can't get results to wrap text...

Please help!

<script type="text/javascript">

    document.addEventListener('DataPageReady', function(event) {

            if (event.detail.appKey == '[@cbAppKey]') {

                // var lockstatus = document.querySelector(".cbResultSetCalculatedField").innerHTML;
                var lockstatus = "[@LockStatus]";

                console.log(lockstatus);

                if (lockstatus == "Locked") {
                    var checkboxes = document.querySelectorAll("[action*='[@cbAppKey]'] input[type='checkbox']");

                    for (let cb of checkboxes) {
                        cb.style.display = "none";
                    }

                    var exes = document.querySelectorAll("[action*='[@cbAppKey]']  a[data-cb-name='InlineDelete']");

                    for (let x of exes) {
                        x.style.display = "none";
                    }

                    var bulkdelete = document.querySelectorAll("[action*='[@cbAppKey]']  a[data-cb-name='BulkDeleteButton']");

                    for (let bd of bulkdelete) {
                        bd.style.display = "none";
                    }

                }
            }
    });
</script>

DrSimi · September 1, 2023

Hi @MatthewK,

SharePoint does not support the embed code, so you would need to use the iFrame deploy code from Caspio if you want to have everything working correctly.