Disable a drop down list depending on the value of another drop down list

I have two drop down lists.
If the user selects "Cancelled" on the first drop down list, I would like to disable the second drop down list.
Is there a way to do this?
Thanks in advance!

I found the solution.
I added a script in JavaScript OnLoad event in the add or edit page, similar to the following, but with the proper variable name:
var firstDropDownListCtrl = Runner.getControl(pageid, 'firstDropDownList');

var secondDropDownListCtrl = Runner.getControl(pageid, 'secondDropDownList');
secondDropDownListCtrl.setDisabled();
function checkDisableSecondDropDownList()

{

// status = 0 is Cancelled

var status = firstDropDownListCtrl.getValue();

if (status == 0 || status == -1) {

secondDropDownListCtrl.setDisabled();

} else {

secondDropDownListCtrl.setEnabled();

}

}
firstDropDownListCtrl.on('change', checkDisableSecondDropDownList);