How to customize boostrap date picker in service portal?

michelmeulen
Tera Expert

Hi, community.

I'm currently working on a project in the service portal part of servicenow, but I ran into an issue trying to customize the date picker (the one you see on the "forms" page.). I want to change the start day, (in the bootstrap date picker, the first day of the week is set to sunday, and the client would like it to be set to monday in order to make it consistent with the datepicker they use in the other parts of their servicenow instance) and assuming that I'm correct in my estimation that service portal uses the standard bootstrap date picker, I should be able to make that change fairly easily if I can get to the datepicker's code. Herein lies my problem.   As much as I stared at the 'forms' widget, I could not determine where it was getting the datepicker from. The datepicker also does not appear to be a widget or a script include, or if it is I can't find it. Am I looking in the wrong place? Or is it flat out impossible to reach the datepicker? If it is, is there a different way to customize it? A little sneaky hack I can make use of to reach it until service portal enables us to reach it properly? Perhaps in the forms widget? I've already tried to add

$scope.dateOptions = {

  formatYear: 'yy',

  showWeeks: true,        

  startingDay: 1

};

to the client script of the forms widget, in the foolish optimism that maybe the datepicker would somehow be defined in the widget's scope, but this had no effect, so I assume I'd have to reach it from elsewhere, or somehow inject it into the widget's script.

So what do I do? Has anyone had a similar issue? How did you solve it? Or am I just blind and constantly looking over the widget or script include I'm meant to change?

1 ACCEPTED SOLUTION

jameswang
Kilo Expert

Hi, in my first reply of the Bootstrap, there is a component called 'datepicker popup', the calendar starts with Monday-Tuesday...


Again, the link is below.


Angular directives for Bootstrap



-James


View solution in original post

7 REPLIES 7

jameswang
Kilo Expert

Hi, in my first reply of the Bootstrap, there is a component called 'datepicker popup', the calendar starts with Monday-Tuesday...


Again, the link is below.


Angular directives for Bootstrap



-James


I suppose creating a new datepicker instance is as close as I can possibly get to solving this issue. Thank you.


Viktor Bardakov
Kilo Contributor

Please tell me more about what and where you need to do in an instance for this to work