ReactJS Moment is not formatting date correctly












2














I have a function for displaying the first date of the week and it's result are displayed as followed:



Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)



...what am attempting to do is display the result with the month only:
2018-11-12



...here is the function for getting the first day of the week:



let sd = new Date();
const startOfWeek = (date) => {
let diff = date.getDate() - date.getDay() + (date.getDay() === 0 ? -6 : 1);
return new Date(date.setDate(diff));
}


...I call the function as followed:



const startDay = startOfWeek(sd).toString();


...Here is where I Use moment to apply the formatting:



moment(startDay).format('YYYY MMMM Do');


...but my date still displays the following:
Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)



...could I get some help as to what am doing wrong?










share|improve this question


















  • 1




    The .format() function returns the formatted string. It does not forever establish the formatting for the object.
    – Pointy
    Nov 13 at 14:24






  • 1




    FYI, Moment has a startOf function...
    – Heretic Monkey
    Nov 13 at 14:25






  • 2




    You might also want to look at Luxon, as it uses immutable objects, which might be a better fit for React.
    – Heretic Monkey
    Nov 13 at 14:27










  • Can you add more code where you use the line moment(startDay).format('YYYY MMMM Do'); please? It's not clear why you are getting the output "Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)" having looked at your moment format string.
    – Rupert
    Nov 13 at 14:45
















2














I have a function for displaying the first date of the week and it's result are displayed as followed:



Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)



...what am attempting to do is display the result with the month only:
2018-11-12



...here is the function for getting the first day of the week:



let sd = new Date();
const startOfWeek = (date) => {
let diff = date.getDate() - date.getDay() + (date.getDay() === 0 ? -6 : 1);
return new Date(date.setDate(diff));
}


...I call the function as followed:



const startDay = startOfWeek(sd).toString();


...Here is where I Use moment to apply the formatting:



moment(startDay).format('YYYY MMMM Do');


...but my date still displays the following:
Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)



...could I get some help as to what am doing wrong?










share|improve this question


















  • 1




    The .format() function returns the formatted string. It does not forever establish the formatting for the object.
    – Pointy
    Nov 13 at 14:24






  • 1




    FYI, Moment has a startOf function...
    – Heretic Monkey
    Nov 13 at 14:25






  • 2




    You might also want to look at Luxon, as it uses immutable objects, which might be a better fit for React.
    – Heretic Monkey
    Nov 13 at 14:27










  • Can you add more code where you use the line moment(startDay).format('YYYY MMMM Do'); please? It's not clear why you are getting the output "Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)" having looked at your moment format string.
    – Rupert
    Nov 13 at 14:45














2












2








2







I have a function for displaying the first date of the week and it's result are displayed as followed:



Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)



...what am attempting to do is display the result with the month only:
2018-11-12



...here is the function for getting the first day of the week:



let sd = new Date();
const startOfWeek = (date) => {
let diff = date.getDate() - date.getDay() + (date.getDay() === 0 ? -6 : 1);
return new Date(date.setDate(diff));
}


...I call the function as followed:



const startDay = startOfWeek(sd).toString();


...Here is where I Use moment to apply the formatting:



moment(startDay).format('YYYY MMMM Do');


...but my date still displays the following:
Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)



...could I get some help as to what am doing wrong?










share|improve this question













I have a function for displaying the first date of the week and it's result are displayed as followed:



Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)



...what am attempting to do is display the result with the month only:
2018-11-12



...here is the function for getting the first day of the week:



let sd = new Date();
const startOfWeek = (date) => {
let diff = date.getDate() - date.getDay() + (date.getDay() === 0 ? -6 : 1);
return new Date(date.setDate(diff));
}


...I call the function as followed:



const startDay = startOfWeek(sd).toString();


...Here is where I Use moment to apply the formatting:



moment(startDay).format('YYYY MMMM Do');


...but my date still displays the following:
Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)



...could I get some help as to what am doing wrong?







javascript reactjs momentjs






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Nov 13 at 14:23









user1724708

301723




301723








  • 1




    The .format() function returns the formatted string. It does not forever establish the formatting for the object.
    – Pointy
    Nov 13 at 14:24






  • 1




    FYI, Moment has a startOf function...
    – Heretic Monkey
    Nov 13 at 14:25






  • 2




    You might also want to look at Luxon, as it uses immutable objects, which might be a better fit for React.
    – Heretic Monkey
    Nov 13 at 14:27










  • Can you add more code where you use the line moment(startDay).format('YYYY MMMM Do'); please? It's not clear why you are getting the output "Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)" having looked at your moment format string.
    – Rupert
    Nov 13 at 14:45














  • 1




    The .format() function returns the formatted string. It does not forever establish the formatting for the object.
    – Pointy
    Nov 13 at 14:24






  • 1




    FYI, Moment has a startOf function...
    – Heretic Monkey
    Nov 13 at 14:25






  • 2




    You might also want to look at Luxon, as it uses immutable objects, which might be a better fit for React.
    – Heretic Monkey
    Nov 13 at 14:27










  • Can you add more code where you use the line moment(startDay).format('YYYY MMMM Do'); please? It's not clear why you are getting the output "Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)" having looked at your moment format string.
    – Rupert
    Nov 13 at 14:45








1




1




The .format() function returns the formatted string. It does not forever establish the formatting for the object.
– Pointy
Nov 13 at 14:24




The .format() function returns the formatted string. It does not forever establish the formatting for the object.
– Pointy
Nov 13 at 14:24




1




1




FYI, Moment has a startOf function...
– Heretic Monkey
Nov 13 at 14:25




FYI, Moment has a startOf function...
– Heretic Monkey
Nov 13 at 14:25




2




2




You might also want to look at Luxon, as it uses immutable objects, which might be a better fit for React.
– Heretic Monkey
Nov 13 at 14:27




You might also want to look at Luxon, as it uses immutable objects, which might be a better fit for React.
– Heretic Monkey
Nov 13 at 14:27












Can you add more code where you use the line moment(startDay).format('YYYY MMMM Do'); please? It's not clear why you are getting the output "Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)" having looked at your moment format string.
– Rupert
Nov 13 at 14:45




Can you add more code where you use the line moment(startDay).format('YYYY MMMM Do'); please? It's not clear why you are getting the output "Mon Nov 12 2018 08:14:09 GMT-0600 (Central Standard Time)" having looked at your moment format string.
– Rupert
Nov 13 at 14:45












2 Answers
2






active

oldest

votes


















0














This should work, the format was incorrect though, it should be YYYY-MM-D



let sd = new Date();
const startOfWeek = (date) => {
let diff = date.getDate() - date.getDay() + (date.getDay() === 0 ? -6 : 1);
return new Date(date.setDate(diff));
}
const startDay = startOfWeek(sd)
console.log(moment(startDay).format('YYYY-MM-D'));





share|improve this answer





















  • Thank you, that worked, and even when outputted in the console, the format is what I wanted; ...but, via the browser it still shows Mon Nov 12 2018 10:54:17 GMT-0600 (Central Standard Time) ...still your remedy works when outputted via the console. Any ideal why it want reflect in the webpage? Am using Reactjs
    – user1724708
    Nov 13 at 16:59












  • How are you displaying it ? can you share your snippet?
    – abolajibisiriyu
    Nov 14 at 6:04



















1














I think the moment js format you are looking for is:



moment(startDay).format('YYYY-MM-DD');



The format YYYY MMMM Do would return a string like: "2018 November 13th".






share|improve this answer





















  • strange, this works when outputted to the console, but the browser still shows the following: Mon Nov 12 2018 11:08:23 GMT-0600 (Central Standard Time) ... an showing the date in a text input field, though I do think that show make a difference.
    – user1724708
    Nov 13 at 17:12











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














draft saved

draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53283157%2freactjs-moment-is-not-formatting-date-correctly%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown

























2 Answers
2






active

oldest

votes








2 Answers
2






active

oldest

votes









active

oldest

votes






active

oldest

votes









0














This should work, the format was incorrect though, it should be YYYY-MM-D



let sd = new Date();
const startOfWeek = (date) => {
let diff = date.getDate() - date.getDay() + (date.getDay() === 0 ? -6 : 1);
return new Date(date.setDate(diff));
}
const startDay = startOfWeek(sd)
console.log(moment(startDay).format('YYYY-MM-D'));





share|improve this answer





















  • Thank you, that worked, and even when outputted in the console, the format is what I wanted; ...but, via the browser it still shows Mon Nov 12 2018 10:54:17 GMT-0600 (Central Standard Time) ...still your remedy works when outputted via the console. Any ideal why it want reflect in the webpage? Am using Reactjs
    – user1724708
    Nov 13 at 16:59












  • How are you displaying it ? can you share your snippet?
    – abolajibisiriyu
    Nov 14 at 6:04
















0














This should work, the format was incorrect though, it should be YYYY-MM-D



let sd = new Date();
const startOfWeek = (date) => {
let diff = date.getDate() - date.getDay() + (date.getDay() === 0 ? -6 : 1);
return new Date(date.setDate(diff));
}
const startDay = startOfWeek(sd)
console.log(moment(startDay).format('YYYY-MM-D'));





share|improve this answer





















  • Thank you, that worked, and even when outputted in the console, the format is what I wanted; ...but, via the browser it still shows Mon Nov 12 2018 10:54:17 GMT-0600 (Central Standard Time) ...still your remedy works when outputted via the console. Any ideal why it want reflect in the webpage? Am using Reactjs
    – user1724708
    Nov 13 at 16:59












  • How are you displaying it ? can you share your snippet?
    – abolajibisiriyu
    Nov 14 at 6:04














0












0








0






This should work, the format was incorrect though, it should be YYYY-MM-D



let sd = new Date();
const startOfWeek = (date) => {
let diff = date.getDate() - date.getDay() + (date.getDay() === 0 ? -6 : 1);
return new Date(date.setDate(diff));
}
const startDay = startOfWeek(sd)
console.log(moment(startDay).format('YYYY-MM-D'));





share|improve this answer












This should work, the format was incorrect though, it should be YYYY-MM-D



let sd = new Date();
const startOfWeek = (date) => {
let diff = date.getDate() - date.getDay() + (date.getDay() === 0 ? -6 : 1);
return new Date(date.setDate(diff));
}
const startDay = startOfWeek(sd)
console.log(moment(startDay).format('YYYY-MM-D'));






share|improve this answer












share|improve this answer



share|improve this answer










answered Nov 13 at 15:18









abolajibisiriyu

414




414












  • Thank you, that worked, and even when outputted in the console, the format is what I wanted; ...but, via the browser it still shows Mon Nov 12 2018 10:54:17 GMT-0600 (Central Standard Time) ...still your remedy works when outputted via the console. Any ideal why it want reflect in the webpage? Am using Reactjs
    – user1724708
    Nov 13 at 16:59












  • How are you displaying it ? can you share your snippet?
    – abolajibisiriyu
    Nov 14 at 6:04


















  • Thank you, that worked, and even when outputted in the console, the format is what I wanted; ...but, via the browser it still shows Mon Nov 12 2018 10:54:17 GMT-0600 (Central Standard Time) ...still your remedy works when outputted via the console. Any ideal why it want reflect in the webpage? Am using Reactjs
    – user1724708
    Nov 13 at 16:59












  • How are you displaying it ? can you share your snippet?
    – abolajibisiriyu
    Nov 14 at 6:04
















Thank you, that worked, and even when outputted in the console, the format is what I wanted; ...but, via the browser it still shows Mon Nov 12 2018 10:54:17 GMT-0600 (Central Standard Time) ...still your remedy works when outputted via the console. Any ideal why it want reflect in the webpage? Am using Reactjs
– user1724708
Nov 13 at 16:59






Thank you, that worked, and even when outputted in the console, the format is what I wanted; ...but, via the browser it still shows Mon Nov 12 2018 10:54:17 GMT-0600 (Central Standard Time) ...still your remedy works when outputted via the console. Any ideal why it want reflect in the webpage? Am using Reactjs
– user1724708
Nov 13 at 16:59














How are you displaying it ? can you share your snippet?
– abolajibisiriyu
Nov 14 at 6:04




How are you displaying it ? can you share your snippet?
– abolajibisiriyu
Nov 14 at 6:04













1














I think the moment js format you are looking for is:



moment(startDay).format('YYYY-MM-DD');



The format YYYY MMMM Do would return a string like: "2018 November 13th".






share|improve this answer





















  • strange, this works when outputted to the console, but the browser still shows the following: Mon Nov 12 2018 11:08:23 GMT-0600 (Central Standard Time) ... an showing the date in a text input field, though I do think that show make a difference.
    – user1724708
    Nov 13 at 17:12
















1














I think the moment js format you are looking for is:



moment(startDay).format('YYYY-MM-DD');



The format YYYY MMMM Do would return a string like: "2018 November 13th".






share|improve this answer





















  • strange, this works when outputted to the console, but the browser still shows the following: Mon Nov 12 2018 11:08:23 GMT-0600 (Central Standard Time) ... an showing the date in a text input field, though I do think that show make a difference.
    – user1724708
    Nov 13 at 17:12














1












1








1






I think the moment js format you are looking for is:



moment(startDay).format('YYYY-MM-DD');



The format YYYY MMMM Do would return a string like: "2018 November 13th".






share|improve this answer












I think the moment js format you are looking for is:



moment(startDay).format('YYYY-MM-DD');



The format YYYY MMMM Do would return a string like: "2018 November 13th".







share|improve this answer












share|improve this answer



share|improve this answer










answered Nov 13 at 14:41









Rupert

1,056620




1,056620












  • strange, this works when outputted to the console, but the browser still shows the following: Mon Nov 12 2018 11:08:23 GMT-0600 (Central Standard Time) ... an showing the date in a text input field, though I do think that show make a difference.
    – user1724708
    Nov 13 at 17:12


















  • strange, this works when outputted to the console, but the browser still shows the following: Mon Nov 12 2018 11:08:23 GMT-0600 (Central Standard Time) ... an showing the date in a text input field, though I do think that show make a difference.
    – user1724708
    Nov 13 at 17:12
















strange, this works when outputted to the console, but the browser still shows the following: Mon Nov 12 2018 11:08:23 GMT-0600 (Central Standard Time) ... an showing the date in a text input field, though I do think that show make a difference.
– user1724708
Nov 13 at 17:12




strange, this works when outputted to the console, but the browser still shows the following: Mon Nov 12 2018 11:08:23 GMT-0600 (Central Standard Time) ... an showing the date in a text input field, though I do think that show make a difference.
– user1724708
Nov 13 at 17:12


















draft saved

draft discarded




















































Thanks for contributing an answer to Stack Overflow!


  • Please be sure to answer the question. Provide details and share your research!

But avoid



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.





Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


Please pay close attention to the following guidance:


  • Please be sure to answer the question. Provide details and share your research!

But avoid



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.




draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53283157%2freactjs-moment-is-not-formatting-date-correctly%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







Popular posts from this blog

Guess what letter conforming each word

Port of Spain

Run scheduled task as local user group (not BUILTIN)