Formatting date in client script

pauladams
Tera Contributor

Hello Community,

I am trying to write a simple client script to compare two date variables. What I thought of achieving through a simple script doesn't seem to be simple any more and here is the complete case.

Environment: Helsinki Patch 8

We have a custom application named "Trade Show Management". It has a table named "Trade Shows" where trade shows are pre-created by the trade show admins and employees can register/signup for the tradeshows in "accepting registration" status.

Another table by name "Signups" is created with several columns and one of them is trade_show which is a reference to the "Trade Show"   table.

For the users to signup for the tradeshows a record producer catalog item is configured.

The catalog item has the following variables

- Attendee (Reference Field)

- Trade Show (Reference field)

- Trade Show Start Date (should be read only, and should populate based on the start_date of the Trade Show selected)

- Trade Show End Date (should be read only, and should populate based on the end_date of the Trade Show selected)

- Attendee Start Date (Date, read write, user manually selects a date)

- Attendee End Date (Date read write, user manually selects a date)

I am able to populate the "Trade Show Start Date" and "Trade Show End Date" successfully, when the user selects a "Trade Show". I did this with a client script written on "onChange" condition over the "Trade Show" variable.

Here is the problem: the dates are populated in the "YYYY-mm-dd" format.

I've checked the global date format on the system properties and it is set to "mm-dd-YYYY" format and the user date format is also set to "mm-dd-YYYY"

Not sure why it still shows the date in "YYYY-mm-dd" format.

To understand this a more I made these two fields read-write and let the user select/change the dates manually. When a user manually selects the dates its in the desired "mm-dd-YYYY" format.

Is this a bug?

Formatting is not the only issue for me. I need to compare/impose some validations/constraints over these two variables i.e. the "Attendee Start Date" shouldn't be after the "Trade Show End Date" and the "Attendee End Date" shouldn't be before "Trade Show Start Date". I've a client script to validate this and stops the user from submitting if one of these conditions is not met.

I've a similar requirement to check the "Attendee Start Date" and "Attendee End Date" variables i.e."Attendee End Date" shouldn't be before "Attendee Start Date". I am successfully able to impose that constraint through the same script.

The comparison between "Trade Show End Date" and "Attendee Start Date" and "Trade Show Start Date" and "Attendee End Date" also works perfectly when the "Trade Show Start Date" and "Trade Show End Date" are manually selected and the format is in "mm-dd-YYYY" format. So I concluded that it is the formatting of "Trade Show Start Date" and "Trade Show End Date" that is causing the problem.

I am pasting the client script to populate those dates and change their formatting. Please review and advise me where I am going wrong or is there another way to format the dates.

Script # 1 - Populate Show Dates, Client Script type onChange, variable name "u_trade_show"

function onChange(control, oldValue, newValue, isLoading) {
if (isLoading || newValue == ''){
  return;
}

var tradeShow = g_form.getReference('u_trade_show, fetchDate);
function fetchDate(tradeShow) {
  if (tradeShow) {
   

  g_form.setValue('u_start_date', tradeShow.start_date); //populates the correct date but in "YYYY-mm-dd" format
  g_form.setValue('u_end_date', tradeShow.end_date); //populates the correct date but in "YYYY-mm-dd" format
 

//tried the following way to change the format

var tssd = getDateFromFormat(tradeShow.start_date, g_user_date_format);

var tsed = getDateFromFormat(tradeShow.end_date, g_user_date_format);

g_form.setValue('u_start_date', tssd); //populates a value of "0"

  g_form.setValue('u_end_date', tsed); //populates a value of "0"

  }

}
}

Appreciate your time and help!

Thanks

Pa

1 ACCEPTED SOLUTION

Nana5
Mega Guru

HI Paul,


I belive u need to use date format as below i have posted the example.


var date = new Date('2010-10-11T00:00:00+05:30');
alert
((date.getMonth() + 1) + '/' + date.getDate() + '/' +   date.getFullYear());


View solution in original post

13 REPLIES 13

Nana5
Mega Guru

HI Paul,


I belive u need to use date format as below i have posted the example.


var date = new Date('2010-10-11T00:00:00+05:30');
alert
((date.getMonth() + 1) + '/' + date.getDate() + '/' +   date.getFullYear());


pauladams
Tera Contributor

Thanks Prakash. nana



This helped me to display the value in the desired format and I enhanced it a little bit by appending '0' and slicing.



I understand for month date.getMonth() gives one number less than the actual month number as the index for months start from 0 and not from 1 i.e. January is "0" and hence we need to add 1.



However, I see a problem as it is giving me a Date which is one day less than the actual i.e. if the actual date is "05-01-2017" date.getDate() is returning 30 (30th April). Not sure why.



Here is what I am doing



var tssd = new Date(tradeShow.start_date);


var tssd_frmt = ('0'+(tsssd.getMonth()+1)).slice(-2) + '-' + ('0'+ tssd.getDate()).slice(-2) + '-' + tssd.getFullYear();



when I display tssd through alert(), I see it is also have HH:MM:SS and it is always "20:00:00", like show below.


find_real_file.png


Could this be a timezone issue?


Appreciate your help.


I'm theorising that the date is stored in the server locale then displayed according to system/user preferences - both format and timezone.



I'm willing to bet there are some API methods that localise the server date to the user locale, then transform it into the user-selectable format.



See if these help: Client APIs



(When I get time, I'm going to have a play with this myself.. it's an interesting topic to explore!)


Thanks Dave david-smith


I was not successful in finding an appropriate one to help with this.


Looking forward for your learning/finding after your explore.



Appreciate your response and time.



- Pa