Fail in options.buttons.handler when selecting by "class" instead of "id"

[LufoX11]

Mobiscroll: 2.15.1
Platform: jQM 1.4.5 / jQ 1.11.1

If you are customizing buttons and their handlers (leaving the default handlers), like:

options = {
   buttons: [
      {
         text: "Today",
         handler: "now",
         cssClass: "ui-btn ui-corner-all ui-shadow ui-mini ui-btn-icon-left ui-icon-back"
      },
      {
         text: "Set",
         handler: "set",
         cssClass: "ui-btn ui-corner-all ui-shadow ui-mini ui-btn-icon-left ui-icon-check"
      }
   ]
}

and you use a selector by class instead of an ID, like:

$(".myClass").mobiscroll().calendar(options);

where you have more than 1 element with no ID, like:

<a href="#" class="myClass">Launch Calendar 1</a>
<a href="#" class="myClass">Launch Calendar 2</a>

it will bind ok but won't work as expected.
The first link will open and work perfectly (link 1 or link 2). After closing it, if you try to open the other one, it will work too (the modal will show), however buttons won't work anymore. They will still work for the modal you opened for the first time.

As a workaround, I had to iterate over those elements and bind the component 1 to 1:

$.each($(".myClass"), function () {
    $(this).mobiscroll().calendar(options);
});

Am I doing something wrong? I noticed that if the element hasn't an ID, mobiscroll generates one for it, so I assume this is a bug, specially because if I don't customize "options.buttons", they will work good with the same code provided before.

Thanks.

[LufoX11]

I realized this is an object related issue. If I do a copy of the options object, it will work:

// it doesn't work
var options = { ... };
$(".myClass").mobiscroll().calendar(options);

// it doesn't work
var options = { ... };
$.each($(".myClass"), function () {
    $(this).mobiscroll().calendar(options);
});

// it works
var options = { ... };
$.each($(".myClass"), function () {
    $(this).mobiscroll().calendar($.extend(true, {}, options));
});

I think you are working directly over the options object, so if I'm passing the reference of an object instead of an object itself (like $...calendar({ buttons: [...] }) it will work only with the properties assigned the first time I launched the modal.

The reason it worked in my previous post was because I'm using an external function to assign default properties, so iterating outside this function will create a new options obect over each iteration ("options" is a local var in the function).

[dioslaska]

You're right, the problem is that the same buttons array is used for the different instances.

The workaround is, like you mentioned, to initialize the instances with a separate options object.

[dioslaska]

Fixed in 2.16.1