Create on change events after data query

I am trying to hide/show and expand/collapse elements based on the user’s data (if a checkbox is checked and if an image is there). I am also trying to add OnChange event to the page when the user makes a change (before submitting to database). I am having trouble getting the following code to work. Any help would be appreciated, thank you!

$w.onReady(function () { 
 //get data from dyanmic dataset
    $w("#dynamicDataset").onReady(() => { 
 
 //get the properties for the current user and stores them in items
 const items = $w("#dynamicDataset").getCurrentItem(); 

 
 //show hide elements based on the dynamic data set first. then do the OnChange event    
 if (items.checkbox1.checked) { 
 // Checks if the current item has a value in the image field, if not then collapse the space
 if (!items.image1) {
            $w("#image1").collapse();
                            }
 else {
            $w("#image1").expand();
        }
 
        $w("#uploadButton1").show();
        }
 else {
        $w("#uploadButton1").hide();
        }
 
//create an On Change event for when the user make changes on the static my list page
    $w('#checkbox1').onChange( (event, $w) => {   
 if ($w('#checkbox1').checked) {
        $w('#uploadButton1').show();
 
    } else {
        $w('#uploadButton1').hide();
        $w('#image1').collapse();

    } 
});

#query #database #currentuser #onchange #dynamic #checkbox #checked