Как да клонирам jquery datepicker?

Трябва да клонирам (за да наследя) от jQuery обект за избор на дата и да заменя метода _generatedHTML. Моят код:

$.fn.datepickerExt = $.fn.datepicker;
var datepickerOldHTML = $.datepicker._generateHTML;

var datepickerExt = $.extend($.datepicker, {
    _generateHTML: function(inst) {
        var generatedHTML = datepickerOldHTML.apply(this, arguments);
        return "<div style='text-align:center'>header</div>"+generatedHTML;
    }
})

Но не съм сигурен, че имам различни обекти $.fn.datepicker и $.fn.datepickerExt..

Връзка за JSFiddle: http://jsfiddle.net/konstantin/9Rjna/

В този случай заглавката трябва да се добави само за datepickerExt...


inheritance datepicker jquery uidatepicker jquery-ui-datepicker
person Konstantin Petrenko    schedule 04.06.2012    source източник
comment
Този въпрос ми помогна с подобен проблем миналата седмица.   -  person Blazemonger    schedule 04.06.2012
comment
За съжаление, това не е отговор на моя въпрос. Трябва да наследя от съществуващ инструмент за избор на дати (като собствен плъгин)   -  person Konstantin Petrenko    schedule 04.06.2012

Отговори (2)


arrow_upward
2
arrow_downward

Срещам същия проблем и след като преминах през повечето предложени решения, намерих изход.

$('#actions').append($new_row);
$('#actions').find('input.datepicker').removeClass("hasDatepicker").removeAttr('id');
$('#actions').find('button.ui-datepicker-trigger').remove();
$('#actions').find('input.datepicker').unbind();
$('#actions').find('input.datepicker').datepicker('destroy');
$('#actions').find('input.datepicker').datepicker(
{
   autoSize:false,
   showOn:'button',
   dateFormat:'yy-mm-dd',
   weekHeader: 'W',
   showWeek: true,
   firstDay: 0,
   changeMonth: true,
   changeYear: true,
   gotoCurrent:true,
   showButtonPanel:true,
   showAnim:'',
   duration:'fast'
}
);

След вмъкване на клонираните елементи (в ID "действия"):

  1. Премахнете всеки ID на избор на дата, така че да бъде открит
  2. Премахнете бутона избор на дата или той ще се дублира в клонирания елемент
  3. Премахване на datepicker (не знам много за това, но е задължително)
  4. Унищожи избор на дата
  5. Сега всичко е изчистено, повторно инициализиране на събитието datapicker
person Fredric Yeung    schedule 12.12.2012

arrow_upward
0
arrow_downward

Първо, трябва да клонирате обекта $.datepicker, който е екземпляр на Datepicker (частен клас в jQuery код). в противен случай бихте направили само копие и пишете същия метод.

Второ, трябва да копирате кода на $.fn.datepicker, защото той вътрешно извиква екземпляра на $.datepicker.

Код:

(function($, window, undefined) {

    $.datepickerExt = jQuery.extend({}, $.datepicker);
    var datepickerOldHTML = $.datepicker._generateHTML;

    $.datepickerExt._generateHTML = function(inst) {
        var generatedHTML = datepickerOldHTML.apply(this, arguments);
        return "<div style='text-align:center'>header</div>" + generatedHTML;
    };

    $.fn.datepickerExt = function(options) {

        /* Verify an empty collection wasn't passed - Fixes #6976 */
        if (!this.length) {
            return this;
        }

        /* Initialise the date picker. */
        if (!$.datepickerExt.initialized) {
            $(document).mousedown($.datepickerExt._checkExternalClick).
            find('body').append($.datepickerExt.dpDiv);
            $.datepickerExt.initialized = true;
        }

        var otherArgs = Array.prototype.slice.call(arguments, 1);
        if (typeof options == 'string' && (options == 'isDisabled' || options == 'getDate' || options == 'widget')) return $.datepickerExt['_' + options + 'Datepicker'].apply($.datepickerExt, [this[0]].concat(otherArgs));
        if (options == 'option' && arguments.length == 2 && typeof arguments[1] == 'string') return $.datepickerExt['_' + options + 'Datepicker'].apply($.datepickerExt, [this[0]].concat(otherArgs));
        return this.each(function() {
            typeof options == 'string' ? $.datepickerExt['_' + options + 'Datepicker'].
            apply($.datepickerExt, [this].concat(otherArgs)) : $.datepickerExt._attachDatepicker(this, options);
        });
    };

}());

изпълни

person andres descalzo    schedule 12.12.2012
comment
Това не работи, тъй като при щракване върху някаква дата се извиква оригиналната функционалност за избор на дата и по този начин не се извиква нова функция за генериране. Може лесно да се види в примера, че при щракване върху заглавката на датата изчезва. - person user2846569; 15.10.2015