Hi Community,
Would like to disable the selection of weekends and the past dates before the current date.
How should I write in JS? If so how?
Please advise.
Hi Alvin,
As I can see in the Screenshot you are using Kendo Date picker, so you can refer below links to disable the dates and days using Kendo UI
https://stackoverflow.com/questions/52417280/how-to-disable-the-past-dates-in-the-kendo-date-picker/52419297
https://docs.telerik.com/kendo-ui/api/javascript/ui/calendar/configuration/disabledates
Hope that will help you
Regards,
Krushna
Krushana Mantri wrote:
Hi Krushna,
I have a question if I want to put this in my OutSystems JS. How can I do it?
Information:
you need to add this logic to your Kendo calender widget JS like what I did in below:
Based on my information given above, which id represent the "Calenderid" or is it an entire new id created.
If so where do I call this? Or I don't need to call it?
Can you please share oml if possible so I can make changes there itself
Sorry but I am not allowed to share the oml.
But I can provide you the information you might need.
My Appt Date Time UI:
The Appointment Date input widget:
The KendoUI_DatePicker webblock:
Inside the KendoUI_DatePicker webblock:
I am thinking of putting the JS here. (Not sure if It is in the right place and if my JS is correct.)
If I click on the calendar Icon once, it will show to this in the properties:
If I click on the calendar Icon twice, it will show to this in the properties:
The javascript should be like below
" $(document).ready(function () { var datepicker = $('#"+WidgetId+"').kendoDatePicker({ value: new Date(), min: new Date(), disableDates: ['sa', 'su'], }).data('kendoDatePicker'); }); "
Hope it will help you
Hi Krushana
I used the above script and even edit some parts but I am receiving this error.
I would suggest not to use jscript to disable sundays in calendar this is achievable without using the jscript, please follow the below steps to do so:
1. Create a list of sundays/holidays from the preparation.
2.Pass the date list inside the "Disable Date" property that you don't want the user to be able to select.
and use "MinDate (Date) " as currdate() to disable the past dates.
For more clarification please refer the below link.
https://success.outsystems.com/Documentation/11/Developing_an_Application/Design_UI/Patterns/Using_Traditional_Web_Patterns/Controls/Date_Picker
Hope this will help you
Vipasha
I have created a component using KENDO, if you stuck anywhere for Date picker you can refer that here
hope that will help
Regards,Krushna
Thanks Krushna,
I referred to your file and encountered this when I publish.
Unable to see the DatePicker Icon
The error I am having is $(...)kendo_DatePicker is not a function.
After googling, I suspect that my jQuery was included twice, once by the program that I was adding a jQuery function to and once by our in-house debugger. Do you know how I can fix this?