How to enable a button if not all required fields are filled?

None of the “Similar quiestons” helped me

I have a button that I need to disable once it was clicked:

<button class="button" type="submit" id="saveButton" hidden="hidden" style="display:none">submit</button>
<input onclick="validator()" id="handleSaveButton" class="button" type="button" value="my button value">

Here’s how I do it:

function validator(){
    $(".buttons :input[value:'my button value']").prop("disabled",true)
    ...
    //something else goes here
    ...
    document.getElementById("saveButton").click();
}

Now this works but my page also has required fields. And if those aren’t filled, you have to refresh the whole page to make save button available again.

I’m looking for a solution to

• Make my button disabled once clicked
• Make it endabled again if required fields are not filled

Thanks. Please note that I cannot change the structure with hidden submit and actual button