Is it possible to add a class to a custom user field to use a datepicker.
Thanks
Edit - The Final Solution:
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script type="text/discourse-plugin" version="0.8">
$( document ).ajaxComplete(function() {
api.onPageChange((url) =>{
if (url.match(/\/preferences\/profile/)) {
$( function() {
var control = $("label:contains('Quit Smoking Date')").next('div.controls');
$(control).find('input').addClass('quitDate');
$( ".quitDate" ).datepicker();
});
}
});
});
</script>
5 إعجابات
It should already work with this class : div.public-user-field.nameofthefield
For example a custom field Book : div.public-user-field.book
إعجاب واحد (1)
And if it is “Quit Smoking Date”? What then?
I got what I wanted to work using this:
A jQuery date picker in the user field input.
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script type="text/discourse-plugin" version="0.8">
$( document ).ajaxComplete(function() {
api.onPageChange(() =>{
$( function() {
var control = $("label:contains('Quit Smoking Date')").next('div.controls');
$(control).find('input').addClass('quitDate');
$( ".quitDate" ).datepicker();
});
});
});
</script>
It would be nice to be able to detect the profile page URL using this but I couldn’t get it to work
api.onPageChange((url) => {
if (url === '/' || url === '/latest' || url === '/top') {
إعجابَين (2)
tshenry
22 مارس 2018، 8:05م
5
Hey @Vaping_Community
For detecting the profile preferences page, this should work:
<script type="text/discourse-plugin" version="0.8">
api.onPageChange((url) =>{
if (url.match(/\/preferences\/profile/)) {
$(function() {
var control = $("label:contains('Quit Smoking Date')").next('div.controls');
$(control).find('input').addClass('quitDate');
$(".quitDate").datepicker();
});
}
});
</script>
6 إعجابات
I will give this a try today, thank you very much
إعجابَين (2)
هل هناك مكون إضافي أحتاج إلى تثبيته لجعله يعمل؟ لقد أضفته إلى قسم الرأس في القالب الخاص بي ولكنه لا يبدو أنه يعمل بالنسبة لي.
Canapin
21 أغسطس 2023، 12:43م
10
الكود المحدث لصفحة الملف الشخصي هو:
<script type="text/discourse-plugin" version="1.4.0">
api.onPageChange((url) =>{
if (url.match(/\/preferences\/profile/)) {
var userField = document.querySelector('.user-field-test-selector');
if (userField) {
var input = userField.querySelector('input');
if (input) {
input.classList.add('testSelector');
input.type = 'date'; // استخدام مدخل التاريخ الأصلي HTML5
}
}
}
});
</script>
استبدل user-field-test-selector باسم الفئة المقابل:
input.classList.add('testSelector'); اختياري ويجب إضافته فقط إذا كنت بحاجة إليه لإجراء تعديلات إضافية، على ما أعتقد.
يجب إنشاء نص برمجي آخر لنافذة إنشاء الحساب.
إعجاب واحد (1)
nathank
29 أغسطس 2023، 11:04م
11
هل يمكن قصر هذا على السنة فقط؟ نحن حريصون على معرفة العمر التقريبي لمستخدمينا لمراقبة التنوع وإدارته، ولكننا لا نرغب في الاحتفاظ بتاريخ ميلادهم الكامل.\n\nأيضًا، هل من الممكن استخدام هذا النوع من الطرق للحصول على حقل قائمة منسدلة قابلة للبحث (أي مع مئات الخيارات)؟
إعجاب واحد (1)
هل لديك أي أفكار حول كيفية إرفاق فئة بالحقل الذي أستهدفه؟ إذا لم يكن ذلك ممكنًا، فهل يمكن استبدال فئة QueryySelector بمعرف div؟
Glad to see you figured out a solution!
