Initialize popup with disabled ok button, then enable based on user action

I’m initializing my popup like so

var newrequest = $('#newrequestform').mobiscroll().popup({
          display: 'top',
          scrollLock: false,
          buttons: ['ok','cancel'],
          okText: 'Save',
          onSet: function (event, inst) {saveRequest()}

Now how do I initialize this popup with the Ok button disabled, and then enable it when the user selects an option?

Hi Vincent,
Could you share some more information about this?
Is there another component inside the popup or what are those options the user is selecting?

Hi Gabi.

Thanks for the reply. In my popup there will be a calendar for the user to select a date. I don’t want them to be able to click “Save” until they’ve selected at least one date.

How do I do that?

Thank you for the details, Vincent!
You can do that with a custom button:

buttons: [{
        text: 'Save',
        cssClass: 'mbsc-fr-btn save-btn',
        handler: 'set'

Add your disabled styling to the button, for example:

.save-btn {
    opacity: .3;
    pointer-events: none;

And inside the calendar’s onSet event you can remove the disabled class from the button:

onSet: function (event, inst) {

Also just an observation: if you only have the calendar inside your popup, you can achieve that with a simple calendar with bubble styling, without the popup.

Please let me know if this helps you!

Thank you Gabi. And thanks for the tip about the bubble style, but I also have another field on the same popup so I don’t think that will work for me.