jQueryUI datepicker ek bir argümanı kabul etmek için nasıl uzatabilirim?

Question

Bu jQueryUI datepicker'ın bir düğmenin datepicker'ı göstermesini tetikleyecek kadar özelleştirilebilir olmasını seviyorum, ancak maalesef kendi işaretlemenizi özelleştirmenize izin vermiyor.

ben şöyle biçimlendirme varsa:

<span> 
    <input type="text" class="datepicker" /> 
</span> 
<span> 
    <button class="datepicker-trigger">Open</button> 
</span> 

Aşağıdaki kodu uygulamak, ben olurdu butonuna tıkladığınızda göstermek için bunu datepicker alabilmek için:

$('.datepicker').datepicker({ 
    showOn:'none' 
}); 
$('.datepicker-trigger').click(function() { 
    $('.datepicker').datepicker('show'); 
}); 

İşte Yukarıdaki kod bir jsFiddle: http://jsfiddle.net/P9Qmu/

Bu iyi ve güzel, ama ne ben gerçekten yapmak istiyorum geçmek istiyorum o datepicker, hangi öğenin göstermeyi tetiklemesi gerektiğini belirten bir nesneyi veya seçiciyi belirten ek bir argüman işlevi görür.

Örneğin, gerçekten bu yapabilmek istiyorum:

$('.datepicker').datepicker({ 
    showOn:'none', 
    trigger:'.datepicker-trigger' 
}); 

Ben yöntemleri ekleyip eklentileri oluşturmak için jQuery uzatmak için nasıl biliyorum ama emin değilim (ya da eğer Mevcut bir fonksiyonda izin verilen argümanları değiştirmek mümkündür.

kimse Yapmam seyir ya da en azından doğru yönde işaret ettiğimi elde etmek $.datepicker uzatmak nasıl biliyor mu? Herhangi bir yardım çok takdir edilecektir.

Answer 1

ne dersiniz:

var __picker = $.fn.datepicker; 

$.fn.datepicker = function(options) { 
    __picker.apply(this, [options]); 
    var $self = this; 

    if (options && options.trigger) { 
     $(options.trigger).bind("click", function() { 
      $self.datepicker("show"); 
     }); 
    } 
} 

Kullanımı:

$("#date").datepicker({ 
    trigger: "#button" 
}); 

$("#date2").datepicker({ 
    trigger: "#button2" 
}); 

Örnek:http://jsfiddle.net/gduhm/

---

Veya daha az intrusively kendi jQuery eklentisi ile:

$.widget("ui.datepicker2", { 
    _init: function() { 
     var $el = this.element; 
     $el.datepicker(this.options); 

     if (this.options && this.options.trigger) { 
      $(this.options.trigger).bind("click", function() { 
       $el.datepicker("show"); 
      }); 
     } 
    } 
}); 

(kullanım datepicker2 ya da her türlü hariç benzer kullanım, bunun adı)

Örnek:http://jsfiddle.net/puVap/

Answer 2

datepicker Widget fabrikası kullanmaz çünkü uzatamaz ve böylece olabildiğince' Bunu uzatmak için kullanın ancak yöntemleri geçersiz kılabilir ve kodunuzu enjekte edebilirsiniz. Jquery UI Datepicker'ın datepicker.js veya jquery-ui'yi kullandığı yöntemlerin tam listesi için.js

yapabilirsiniz basit, Özel JS dosyasına bu kodu ekleyin ve geçersiz kılma sonra, Ne olur ne zamanki

$.datepicker._selectDay_old = $.datepicker._selectDay; 
$.datepicker._selectDay = function(id, month, year, td) { 
    this._selectDay_old(id, month, year, td); 
    // Your code here 
    console.log("Injected Custom Method"); 
} 

// Call Datepicker after Injecting code 
$("#datepicker").datepicker() 

Answer 3

olarak datepicker çağırabilir sen yöntemi için bu modeli takip gereken bir çağrılabilir yöntemi tanımlamak isim:

_<methodName>Datepicker(target, param1, param2,...,paramN) 

ve takvim örneği başvurusunu gerektiren herhangi bir iç yöntemi çağırmak gerekiyorsa, yapmanız gerekir:

var inst = this._getInst(target); 
this._internalMethod(inst);