আমি যে নতুন সাইটের বিকাশ করছি তার বেশ কয়েকটি পৃষ্ঠার জন্য এই সমস্যাটি বের করার চেষ্টা করার জন্য আমি একটি হাস্যকর সময় ব্যয় করেছি এবং কিছুই কার্যকর হয়নি বলে মনে হয়েছে (উপরে যে উপস্থাপিত বিভিন্ন সমাধান রয়েছে তার কোনওটিই আমি সহ প্রয়োগ করেছি I'm আমি অনুমান করছি যে jQuery সবেমাত্র পরিবর্তিত হয়েছে) যথেষ্ট পরিমাণে বিষয়গুলির জন্য তাদের পরামর্শ দেওয়া হয়েছিল যে সমাধানগুলি আর 'কাজ করে না I আমি জানি না Hon সত্যি কথা, কেন কনফিগার করার জন্য jQuery ui- তে কিছু সাধারণ প্রয়োগ করা হয়নি তা আমি বুঝতে পারছি না বলে মনে হচ্ছে as ক্যালেন্ডার সহ একটি মোটামুটি বড় ইস্যু সর্বদা পৃষ্ঠায় পপআপ করে পপ আপের থেকে ইনপুট থেকে এটি খুব বেশি সংযুক্ত থাকে।
যাইহোক, আমি একটি শেষ সমাধান চেয়েছিলাম যা যথেষ্ট জেনেরিক যে আমি এটি যে কোনও জায়গায় ব্যবহার করতে পারি এবং এটি কার্যকর হবে। আমি শেষ পর্যন্ত এমন সিদ্ধান্তে পৌঁছেছি যা উপরে আরো জটিল এবং jQuery- কোড-নির্দিষ্ট উত্তরগুলি এড়িয়ে চলেছে:
জেএসফিডাল: http://jsfiddle.net/mu27tLen/
এইচটিএমএল:
<input type="text" class="datePicker" />
জাতীয়:
positionDatePicker= function(cssToAdd) {
/* Remove previous positioner */
var oldScript= document.getElementById('datePickerPosition');
if(oldScript) oldScript.parentNode.removeChild(oldScript);
/* Create new positioner */
var newStyle= document.createElement("style");
newStyle.type= 'text/css';
newStyle.setAttribute('id', 'datePickerPostion');
if(newStyle.styleSheet) newStyle.styleSheet.cssText= cssToAdd;
else newStyle.appendChild(document.createTextNode(cssToAdd));
document.getElementsByTagName("head")[0].appendChild(newStyle);
}
jQuery(document).ready(function() {
/* Initialize date picker elements */
var dateInputs= jQuery('input.datePicker');
dateInputs.datepicker();
dateInputs.datepicker('option', {
'dateFormat' : 'mm/dd/yy',
'beforeShow' : function(input, inst) {
var bodyRect= document.body.getBoundingClientRect();
var rect= input.getBoundingClientRect();
positionDatePicker('.page #ui-datepicker-div{z-index:100 !important;top:' + (rect.top - bodyRect.top + input.offsetHeight + 2) + 'px !important;}');
}
}).datepicker('setDate', new Date());
});
মূলত আমি প্রতিটি ডেটপিকার "শো" ইভেন্টের আগে মাথায় একটি নতুন স্টাইল ট্যাগ সংযুক্ত করি (উপস্থিত থাকলে পূর্ববর্তীটি মোছা হয়)। জিনিসগুলি করার এই পদ্ধতিটি বিকাশের সময় আমি যে সমস্যার মধ্যে পড়েছিলাম তার একটি বিশাল সংখ্যাগরিষ্ঠতা পেয়ে যায়।
ক্রোম, ফায়ারফক্স, সাফারি এবং আই>> 8 এ পরীক্ষিত (যেমন IE8 জেএসফিডেলের সাথে ভাল কাজ করে না এবং যত্ন নেওয়ার জন্য আমি আমার প্রতিভাত হারাচ্ছি
আমি জানি যে এটি jQuery এবং জাভাস্ক্রিপ্ট প্রসঙ্গে একটি মিশ্রণ, তবে এই মুহুর্তে আমি চেষ্টাটিকে জিক্যুরিতে রূপান্তরিত করতে চাই না। সহজ হবে, আমি জানি। আমি এখনই এই জিনিসটি দিয়ে এতক্ষণে শেষ করেছি। আশা করি এই সমাধান থেকে অন্য কেউ উপকৃত হতে পারেন।