Develop Reference

how to change input date format

I have a input field which is date. It looks like this
output image i got
It was showing dd/mm/yyyy in UI. But my need was yyyy/mm/dd. It should show yyyy/mm/dd instead of dd/mm/yyyy
Code I tried:
export default function App() {
const onDateChange = (dateValue) =>{
console.log(dateValue)
}
return (
<div>
<input onChange = {(e)=>{onDateChange(e.target.value)} } type="date" format='yyyy/mm/dd' />
</div>
);
}
My need was yyyy/mm/dd. It should show yyyy/mm/dd instead of dd/mm/yyyy
I tried searching stackoverflow. Some answers shows, it changes depends upon the locale. But I need it to be yyyy/mm/dd everytime fixed. I tried a lot. But cant find solutions. Please help me with some solutions

For a better experience with dates, I'd recommend you to use the day.js library, it's quite small but very useful, in it you can find an option to format your dates as you wish
e.g. dayjs().format(YYYY-MM-DD)
Hope it works for you

To set and get the input type date in dd-mm-yyyy format we will use type attribute. The type attribute is used to define a date picker or control field. In this attribute, you can set the range from which day-month-year to which day-month-year date can be selected from.

Testing pickadate with jest

On a Rails project, we've got a date picker using pickadate v3.6.2. Tests have been working for some time, but with a recent move away from moment.js to luxon.js some of the feature specs are failing. IRL, the functionality works fine. I think it's about how we're setting the date input. I'm trying to get the right function to drive capybara to set the date input.
The date input is in a form element which has been initialized with
$("#the_date_input").pickadate()
and a consuming script works (IRL) as follows:
const startDateField = this.element.find(this.opts.the_date_inputs_field);
const datePicker = startDateField.pickadate('picker');
if (datePicker) {
// this logs the correct value in the browser console
console.log(datePicker.get('select', 'yyyy-mm-dd'));
...
}
The date format in the browser looks like 12, October, 2020 - long presentable date format.
Our capybara code tries to set the value Rails default to_date string format, which I think is YYYY-MM-DD.
page.execute_script("$('#the_date_input').val('#{start_date.to_date}');")
Do I need to format val as the long english date string? or is there a better way with pickadate to just inject the value or set the value (with JS) in these tests.

Though a better solution would be to build some code to interact with the date picker (like a normal user - as #Thomas Walpole mentions above), programmatically interacting with the date picker modal is tricky.
I found a solution - maybe not ideal - but you can use the pickadate select method to specify a date. This runs through the pickdate code to properly set the input value and whatever else is happening under the hood.
This is my capybara helper method:
def set_pickadate_date(pickadate_selector, date)
page.execute_script("$('#{pickadate_selector}').pickadate('picker').set('select', [#{date.year}, #{date.month - 1}, #{date.day}]);")
end
I found this through the pickadate docs: https://amsul.ca/pickadate.js/api/#method-set-select

You could also have a look at <%= form.date_field :date_attribute %> - it will use a native date picker, supported by all major browsers.
See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date

Netsuite! using freemarker to get the name of the month from a date DD/MM/YYYY doesn't work

Problem
I am working on an email template text whereby I would like to change the date DD/MM/YYYY to MMMM. There are two instances of it in the template. The two instances belong to 2 different date fields however their configuration is the same. Let's say I have date_field1 and date_field2. When I do the following in date_field1 it works fine but in date_field2 it doesn't and I get the following error.
I have checked the type of mydate just to make sure and it is a date. When I just do ?string it works fine and it does contain a date value but with .MMMM, it throws an error. Any help or suggestion will be great.
Code
Working: <#assign mydate1=transaction.date_field1 /> ${mydate1?string.MMMM?lower_case}
Not working: <#assign mydate2=transaction.date_field2 /> ${mydate2?string.MMMM}
Error

If you have an actual date field the format string is like:
<#assign mydate=transaction.date_field2?date["MMMM"]>
And of course there is no field called date_field2 so I assume that label is meant as a simplified example.
Note you can also try:
<#assign mydate=transaction.date_field2?string["MMMM"]>
But I think that was for a more recent version of Freemarker than Netsuite supports.
Finally you can set the overall string to date format which will be in place from the place in your code down to wherever you reset it. I found I had to set it for both date and datetime because some 'date' fields are interpreted by Freemarker as datetime even when they shouldn't be:
<#setting date_format="MMMM">
<#setting datetime_format="MMMM">
${transaction.date_field2}

Bootstrap datepicker setStartDate not working properly?

I am using Bootstrap datepicker and on selecting different values from a list its startdate is changing. It is working fine if I set the startdate 2013 from 2008 but it doesn't work if a select start date 2008 and currently its 2013.
What could be the reason here?
$('#datepicker').datepicker('setStartDate', updatedDate);
This line I am executing whenever I select different startDate.

Really need to know what updatedDate value is.
However, if you read the docs for the dtepicker the value passed in must be a string that is understandable by format
https://bootstrap-datepicker.readthedocs.io/en/latest/methods.html#setstartdate
https://bootstrap-datepicker.readthedocs.io/en/latest/options.html#startdate
Date or String. Default: Beginning of time
The earliest date that may be selected; all earlier dates will be
disabled.
Date should be in local timezone. String must be parsable with format.
So what you pass in as the format option must match the format of your start date. If you do not set the format optin, the default is "mm/dd/yyyy"

Without seeing code, I can only hypothesize; try calling [...].datepicker('update', 'date_string'); on the object to force an update on the control.

How to change the date format in JavaScript?

I am using one jquery date picker,
with using picker i am getting date in like this format
Friday, May 21, 2010
Now i want to add one day in this date so i think, i can only do if i change the date in exact format like
21/5/2010
I want to only convert that bcz i want to add one day to the particular date.
So what do u suggest me? How can I do that?
Can i do without converting it ?
thanks in advance....

Take a look at http://docs.jquery.com/UI/Datepicker#option-dateFormat

datejs may be useful to you.

In addition to the formatting options given by others, you should add using date objects rather than to the string representation of the date object.
I.E.
// add 5 days to today
var myDate=new Date();
myDate.setDate(myDate.getDate()+5);

I think you need to detail what jQuery plugin do you use.
Is it this one? http://jqueryui.com/demos/datepicker/
If so, then when you cann getDate method, you'll get Date object representing a date. You can easily manipulate it.

The date format has nothing to do with how dates are stored; it only affects the way dates are displayed. JavaScript has a native Date object and jQuery UI's Datepicker allows to access such object:
http://jqueryui.com/demos/datepicker/#method-getDate
Once you have a Date object, you can alter it to suit your needs:
https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Date
Finally, you can feed it back into Datepicker:
http://jqueryui.com/demos/datepicker/#method-setDate