0

I am able to fetch the date from the API but unable to fetch the time and I want to display date and time beside the message. If i receive any message then it should show "today 02:21 pm" else for earlier messages it should display "11-09-2019 06:01 am".

Json data that i received through the api:

[
{
"id": "14526fgy",
"message" : "Hello",
"messageime" : "2019-11-12T03:07:58.359"
},

{
"id": "14546fgy",
"message" : "Hi",
"messagetime" : "2019-12-12T10:07:58.359Z"
}
]

In this way

I've attached an example inorder to display date and time. can anyone help me with this?

2
  • 1
    check moment.js library, It is used for date and time different formats. check the link for more. [Link] (momentjs.com) Commented Nov 13, 2019 at 5:42
  • @SaqibNaseeb - Hi, How could i use with my Json data? Can you tell me how to use that as i'm new in reactjs Commented Nov 13, 2019 at 5:48

2 Answers 2

1

First you need to split the date from the API by the T ,

let dateSplit  = result[0].messagedateTime.split("T");

Now you have an array with 2 elements ['2019-11-12','03:07:58.359']

SO first you need to create a variable (e.g todayDate) that contains todays date in the format of the above ie YYYY-MM-DD . You can get from the internet how to extract todays date into that format or create your own custom function to convert date in that format.

After that you need to compare

let firstPart = (todayDate === dateSplit[0])?'today':dateSplit[0];

So second part contains time, you can always refer the moment library to change the date and time formats according to how you need. So that wont be a problem. Hence your main logic is implemented in the above steps i mentioned.

let finalString = `${firstPart} , ${secondPart}`

this final string will be displayed under the chats. And here the second part variable is nothing but the time whihc is extracted according to your format by the moment.js after you pass the dateSplit1 whihc contains the time, Hope you are clear, otherwise ask me for doubts.

Update answer :

displayDate(messagedateTime) {
  let time = messagedateTime;
let arr = time.split("T");
let date = new Date().getDate()
let month  = new Date().getMonth() +1 
let year = new Date().getFullYear()
let todayDate = `${year}-${month}-${date}`

 let firstPart = (todayDate === arr[0])?'today':arr[0];

 let secondPart = (arr[1].split("."))[0]

 let finalString = `${firstPart} ${secondPart}`

return finalString

 console.log(finalString,'wowow')
}

You can also try the js fiddle link Check here to play around

Sign up to request clarification or add additional context in comments.

11 Comments

Sorry at the last, I missed Z in the json file.. "messagedateTime" : "2019-11-12T03:07:58.359Z" . Can you please tell me why we're putting result[0] here..
im assuming the result of api you are storing in result variable and since its an array of objects os you are taking the first object, you can have as you want , but split via "t"
Could you please help me where do i need to place the final string.. is it in a function ?
no , where you want to display the final time, there
I've updated in my above query, can you please assist me by seeing the above code, in displaying date and time?
|
0

Just to show you how to use it. make it string to make it in your own format then if moment library or any other library don't have that custom format you want.

let datetime = "2019-11-13T03:07:58.359";

var d = datetime.split("T");

console.log(d);
let timeday = moment(d[0]).calendar();
timeday=timeday.toString();
timeday=timeday.replace(" at","");
console.log(timeday.toString());

5 Comments

I have mentioned that you will get a format and then you have to change it according to your requirements. Like in the output Today at 12:00 AM just remove at from the timeday variable by first converting it into string.
I have updated the answer which will give you the required answer for your first part
Sorry i'm still getting confused.. Are you taking about the first part of the above answer which was given by Gaurav Roy?
This part of your question *If I receive any message then it should show today 02:21 pm *
I apologize for confusion

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.