Format date from a collection

Ask the community
, ,
1

Hello,

I am working on a project that requires me to setup a custom blog page. I have been able to implement the code necessary to assign data to UI elements for the Blog Title, Author Name and Published Date.

However, I have a couple of issues. First, the published date shows the full date and time such as “Mon Feb 06 2023 13:14:57 GMT-0500 (Eastern Standard Time)”. How can I reduce this to a shorter date format such as Feb 6, 2023?

Also, the Author Name displays some weird characters such as f709d22c-e50f-4a05-bceb-804a96b677a0. How can I get this to display the exact name such as Jane Doe?

Below is the current code I have to the page. I’ll appreciate any help fixing the two issues above while still being able to keep the data linked to the UI elements.

P. S. I don’t know coding. I usually just copy and paste :grinning:

import wixData from ‘wix-data’ ;
import wixLocation from ‘wix-location’ ;

let currentPost

$w . onReady ( function () {

wixLocation . onChange (( location ) => { 
    initPage () 
}); 

initPage ()

})

async function initPage ( ) {

$w ( "#post1" ). getPost (). then ( **async**  post  => { 
    currentPost  =  **await**  loadExtraPostData ( post ) 
    assignPostDataToUIElements () 
});

}

async function loadExtraPostData ( post ) {

**let**  postDataFromCollection  =  **await**  wixData . query ( "PostExtraData" ) 
    . eq ( "post" ,  post . _id ) 
    . find () 

postDataFromCollection  =  postDataFromCollection . items [ 0 ] 
**return**  mergePostData ( post ,  postDataFromCollection )

}

async function mergePostData ( post , extraData ) {
return Object . assign ({}, post , extraData )
}

function assignPostDataToUIElements ( ) {
$w ( “#postTitle” ). text = currentPost . title
$w ( “#authorName” ). text = String ( currentPost . author )
$w ( “#publishedDate” ). text = String ( currentPost . publishedDate )
$w ( “#coverImage” ). src = currentPost . coverImage
}

2

UPDATE: I have been able to fix the issue with the date from research. Still struggling wit the Author Name though.

3

Assuming everything else is correct up top, to format the date you can simply do the following to your code:

function assignPostDataToUIElements () {
$w ( “#postTitle” ) . text = currentPost . title
$w ( “#authorName” ) . text = currentPost . author . toString () //updated here
$w ( “#publishedDate” ) . text = currentPost . publishedDate . toLocaleDateString () //updated here
$w ( “#coverImage” ) . src = currentPost . coverImage
}

However, what you are saying with the name sounds like that is the system id (_id). Is your field key correct for the name? Check your object with a console log and make sure your field key is correct.

4

Hi @oakstreetassociates

Thanks for your support. Much appreciated! The issue with the date was fixed. To your question about the field key (author), I have just double checked and it looks correct. It’s from the in-built Wix Blog collection which is read only.

However, I noticed that the field type is “Reference” and the reference collection is “PublicData”. I have the gut feeling that is why it is returning the weird text which might be the system id from that collection. I don’t know whether this additional information helps and whether their is a way to get around the issue.

5

In addition to my last message, I just looked at it again and it is definitely the system id of the record being referenced from the Public Data collection. However, the Nickname from that same collection is what I want to display.

6

Gotcha, that helps. The blog is utilizing numerous reference fields so the best way to get the nickname is by using the author name (which is actually the member id) in a member database query to get the nickname. Here is an example:

import wixData from ‘wix-data’ ;

export async function testBlogQuery ( ) {
let data = await wixData . query ( “Blog/Posts” ). find ()
let authorId = data . items [ 0 ]. author

**let**  members  =  **await**  wixData . query ( "Members/PrivateMembersData" ). eq ( "_id" ,  authorId ). find () 
console . log ( members ,  'member' ) 

**let**  nickname  =  members . items [ 0 ]. nickname 
**return**  nickname

}

In your case you can just take your author id and use the member function I have above to return your nickname.