বুটস্ট্র্যাপ ডেটপিকার - শুধুমাত্র মাস এবং বছর


122

আমি বুটস্ট্র্যাপ ডেটপিকার ব্যবহার করছি এবং আমার কোডটি নীচের মতো, জেএসফিডেলে কোডটির ডেমো

<div class="input-append date" id="datepicker" data-date="02-2012" 
     data-date-format="mm-yyyy">

 <input  type="text" readonly="readonly" name="date" >    
 <span class="add-on"><i class="icon-th"></i></span>      
</div>      


$("#datepicker").datepicker({
        viewMode: 'years',
         format: 'mm-yyyy'
    });

উপরের কোডটি ঠিকঠাক কাজ করছে, তবে আমি যা করার চেষ্টা করছি তা হচ্ছে কেবল কয়েক মাস এবং বছর বেছে নেওয়ার জন্য ব্যবহারকারীরা allow

আপনি কি দয়া করে আমাকে তা করতে পারেন?


আমি কেবল দুটি নির্বাচিত বাক্স ব্যবহার করব ... এটি ক্যালেন্ডার উইজেট ব্যবহার করা এবং আসল ক্যালেন্ডারটি আড়াল করার চেষ্টা করার চেয়ে অনেক বেশি অর্থবোধ করে।

6
আপনার কাছে এই jsfiddle.net/Kz2sW/1 এর মতো বিকল্প থাকলেও আপনি কি দুটি নির্বাচিত বাক্স ব্যবহার করতে পারেন ? :)
কালো_বেল্ট

উত্তর:


272

এটি সম্পর্কে:

$("#datepicker").datepicker( {
    format: "mm-yyyy",
    viewMode: "months", 
    minViewMode: "months"
});

তথ্যসূত্র: বুটস্ট্র্যাপের জন্য ডেটপিকার er


1.2.0 সংস্করণ এবং নতুনটির জন্য, viewModeএতে পরিবর্তিত হয়েছে startView, সুতরাং ব্যবহার করুন:

$("#datepicker").datepicker( {
    format: "mm-yyyy",
    startView: "months", 
    minViewMode: "months"
});

আরো দেখুন ডকুমেন্টেশন


1
ধন্যবাদ কিন্তু আমি প্রতিস্থাপন করতে ছিল format: " mm"সঙ্গে format: "mm-yyyy"। এটি এখন কাজ করছে :)
কালো_বেল্ট

1
এটা তোলে প্রদর্শন করা হয় না -যদি আগে একটি স্পেস রাখা মাস এবং বছরের মধ্যে mm-yyyyমধ্যে format: " mm-yyyy",, আপনি সম্পাদন করা আপনার উত্তর আবার খুশি করতে পারে?
কালো_বেল্ট

পারফেক্ট। আপনাকে অনেক ধন্যবাদ.
টিগিন

ডকুমেন্টেশন অনুসারে ভিউমোড একটি বৈধ বিকল্প বলে আমি মনে করি না। তবে অন্যান্য বিকল্পগুলি প্রয়োজনীয় প্রদর্শনকে কাজ করতে দেয় allowed
প্রথমেশ দাতর

অটোক্লোজের জন্য কি কোনও বিকল্প আছে?
আলাউদ্দিন আহমেদ


4

আমি সংস্করণ 2 ব্যবহার করছি (উভয় বুটস্ট্র্যাপ v2 এবং v3 সমর্থন করে) এবং আমার জন্য এটি কাজ করে:

$("#datepicker").datepicker( {
    format: "mm/yyyy",
    startView: "year", 
    minView: "year"
});

পরিবর্তন minViewকরুনminViewMode
রাঘবেন্দ্র এন

3

সর্বশেষের জন্য bootstrap-datepicker(লেখার সময় 1.4.0), আপনার এটি ব্যবহার করতে হবে:

$('#myDatepicker').datepicker({
    format: "mm/yyyy",
    startView: "year", 
    minViewMode: "months"
})

উত্স: বুটস্ট্র্যাপ ডেটপিকারের বিকল্পগুলি


বুটস্ট্র্যাপে মাসের ক্লিকের উপর, এটি তারিখটি দেখায় এবং তারপরে মিমি / ওয়াই ফর্ম্যাটে পাঠ্য প্রবেশ করে
শিব সৌরভ

1

আমি ভবিষ্যতের তারিখের জন্য বুটস্ট্র্যাপ ক্যালেন্ডার ব্যবহার করছি কেবলমাত্র মাসে এবং বছরের পরিবর্তনের অনুমতি দেয় না ..

var j = jQuery.noConflict();
        j(function () {
            j(".datepicker").datepicker({ dateFormat: "dd-M-yy" }).val()
        });

        j(function () {
            j(".Futuredatenotallowed").datepicker({
                changeMonth: true,
                maxDate: 0,
                changeYear: true,
                dateFormat: 'dd-M-yy',
                language: "tr"
            }).on('changeDate', function (ev) {
                $(this).blur();
                $(this).datepicker('hide');
            }).val()
        });


0

প্যারা ভিজ্যুয়ালিয়র লস মেসস ডেল আও প্রকৃত, ভিজ্যুয়ালিজা সোলো লস মেসেস, ওয়াই কন এল ফর্মো সোলো তোমা লস মেসেস ডে এজে আও। তবুবিয়ান সিউইটি কনফার্মারটি প্যারা কুই ভিজ্যুয়ালি un

<script>
('#txtDateMMyyyy').datetimepicker({
    format: "mm/yyyy",
    startView: "year",
    minView: "year"
}).datetimepicker("setDate", new Date());
</script>

5
এই কোড স্নিপেটের জন্য আপনাকে ধন্যবাদ, যা কিছু সীমিত, তাত্ক্ষণিক সহায়তা সরবরাহ করতে পারে। একটি সঠিক ব্যাখ্যা কেন এটি সমস্যার একটি ভাল সমাধান এবং এটি ভবিষ্যতের পাঠকদের আরও অন্যান্য অনুরূপ প্রশ্নের সাথে আরও দরকারী করে তুলে ধরে তার দীর্ঘমেয়াদী মানকে ব্যাপকভাবে উন্নত করবে। আপনার অনুমানগুলি সহ কিছু ব্যাখ্যা যুক্ত করতে দয়া করে আপনার উত্তরটি সম্পাদনা করুন।
ইসমাইল পাদিলা

সেপ্টেম্বরে বর্ণনামূলক বিবরণে লো কুই হেসে এল কোডিগো
মার্কো পুঁইয়ান

-1

$('.input-group.date').datepicker("remove");যখন নির্বাচন বিবৃতি পরিবর্তন হবে তখন কেন কল করবেন না তারপরে আপনার তারিখ-পিকার ভিউ সেট করুন এবং তারপরে কল করুন$('.input-group.date').datepicker("update");

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.