2013-09-02 12 views
10

मुझे अपनी प्रोजेक्ट में एक सुविधा की आवश्यकता है जो मुझे लगता है कि बूटस्ट्रैप डेटपिकर अभी भी ऑफर नहीं करता है। मैं डेटपिकर फ़ील्ड को सक्षम/अक्षम करना चाहता हूं ताकि उपयोगकर्ता अपना मान बदल सके। कुछ पढ़ने की तरह कार्यक्षमता।बूटस्ट्रैप डेटपिकर अक्षम सुविधा

इसके बारे में कोई विचार?

अग्रिम धन्यवाद।

+0

उपयोग आप एक समाधान मिला? –

+0

हां, आप इसे उत्तर के रूप में पोस्ट कर सकते हैं –

+0

यदि आपने समाधान सत्यापित किया है तो आपको इसे जांचना चाहिए –

उत्तर

0

मुझे एक समाधान मिला, लेकिन बस बूटस्ट्रैप कैलेंडर कोड को संशोधित करके। KeyUp निष्क्रिय करने के लिए this._events हिस्सा अधिभावी/नीचे घटना मेरे लिए काम किया:

_buildEvents: function(){ 
     if (this.isInput) { // single input 
      this._events = [ 
       [this.element, { 
        focus: $.proxy(this.show, this), 
        keyup: $.proxy(this.update, this), 
        keydown: $.proxy(this.keydown, this) 
       }] 
      ]; 
     } 
     else if (this.component && this.hasInput){ // component: input + button 
      this._events = [ 
       // For components that are not readonly, allow keyboard nav 
       [this.element.find('input'), { 
        //focus: $.proxy(this.show, this), 
        //keyup: $.proxy(this.update, this), 
        //keydown: $.proxy(this.keydown, this) 
       }], 
       [this.component, { 
        click: $.proxy(this.show, this) 
       }] 
      ]; 
     } 
     else if (this.element.is('div')) { // inline datepicker 
      this.isInline = true; 
     } 
     else { 
      this._events = [ 
       [this.element, { 
        click: $.proxy(this.show, this) 
       }] 
      ]; 
     } 

     this._secondaryEvents = [ 
      [this.picker, { 
       click: $.proxy(this.click, this) 
      }], 
      [$(window), { 
       resize: $.proxy(this.place, this) 
      }], 
      [$(document), { 
       mousedown: $.proxy(function (e) { 
        // Clicked outside the datepicker, hide it 
        if (!(
         this.element.is(e.target) || 
         this.element.find(e.target).length || 
         this.picker.is(e.target) || 
         this.picker.find(e.target).length 
        )) { 
         this.hide(); 
        } 
       }, this) 
      }] 
     ]; 
    }, 
2

आप बूटस्ट्रैप की onRender घटना का उपयोग कर सकते हैं, जो datepicker को अक्षम करता है।

onRender: जब एक दिन datepicker अंदर प्रदान की गई है इस घटना को निकाल दिया जाता है। एक स्ट्रिंग वापस करना चाहिए। चयनित होने से दिन अक्षम करने के लिए 'अक्षम' वापसी करें।

-5

तुम बस jQuery attr विधि

$('').attr('disabled', true); 

Thats सभी :)

9
$("#nicIssuedDate").prop('disabled', true); 

इस का उपयोग करने के लिए है बूटस्ट्रैप डेटपिकर और Jquery

1

के साथ मेरे लिए काम करता है जिस विकल्प को आप दिखाना चाहते हैं उसकी सरणी में सक्षम करें विकल्प को सेट करने का प्रयास करें। उस तारीख को तारीख भी सेट करें। तब सभी अन्य तिथियां अक्षम कर दी जाएंगी।

enabledDates: ['your_date_to_show'], 

ईजी।

$('#Date').datetimepicker({ 
    inline: true, 
    viewMode: "days", 
    format: "YYYY-MM-DD", 
    enabledDates: [fetchDate("Date")], 
    }) 
    .data("DateTimePicker") 
    .date(fetchDate("Date")); 

    $('#Date').ready(function(){ 
    $("#Date").data("DateTimePicker").date(fetchDate("Date")); 
    }); 
3

आप निम्न कर सकते हैं:

अक्षम करने के लिए:

$("#date").datepicker("option", "disabled", true);

और सक्षम बनाने के लिए:

$("#date").datepicker("option", "disabled", false);

2

बस इस कार्य करें:

$('#idOfYourCalendar').data("DateTimePicker").disable(); 

सरकारी डॉक्स:

$(".date").datetimepicker({ 
       defaultDate: moment(), 
       format: 'YYYY-MM-DD' 
      }).end().on('keypress paste', function (e) { 
       e.preventDefault(); 
       return false; 
      }); 

यह आप के लिए भी काम करता है आशा है कि: https://eonasdan.github.io/bootstrap-datetimepicker/Functions/

0

मैं इस प्रकार स्वीकार्य समाधान पाने में कामयाब रहे!

0

इस कोड

$("#nicIssuedDate").prop('disabled', true); 
संबंधित मुद्दे