Завъртете календарната таблица на jQuery-ui inline datepicker - jquery, jquery-ui, datepicker, jquery-ui-datepicker

Създадох един вграден календар използвайки плъгин jQuery-ui datepicker. Но контейнерът е по-тесен от календара. Така че имам нужда от решение, което потребителят може да превърта в календара, докато заглавието на datepicker ще остане незавъртано. Така че искам да обгърна таблицата с div. Но "beforeshow"не работи в този случай.

$("#calendar").datepicker({
beforeShow: function() {
$(".ui-datepicker-calendar").wrap("<div class="calendar-wrap"></div>");
}
});

JSFIDDLE връзка

Отговори:

(function ($) {
$.extend($.datepicker, {
_generateHTML_original: $.datepicker._generateHTML,
_generateHTML: function (inst) {
var $html = $(this._generateHTML_original(inst));
return $($html[0]).prop("outerHTML") +
$("<div class="calendar-wrap"></div>").html($html[1]).prop("outerHTML");
}
});
}(jQuery));