get database data to use in js Date

Ask the community
,
1

Hi! I need help!

How do I receive database data based on the data id I’m viewing?

Once I receive the id specific data, I am trying to put the data in replacement of the date string.

 let countDownDate = new Date("July 21, 2020 11:13:00").getTime(); // Countdown date and time

I’d replace July 21 with the data, but would a database calendar date be readable to the javascript date object?

Thanks!! Let me know if I should clarify
@Yisrael (Wix) @Yisrael Hersch so you know, I used your countdown https://www.wix.com/corvid/forum/community-discussion/example-countdown

edit: I found out that the database date translates to javascript format https://www.wix.com/corvid/reference/wix-data.html . that is good, but I still don’t know how to call and use my data.

2

Hallo Melia,
Ich bin nicht sicher, was Sie erreichen wollen?
Möchten Sie Daten aus Ihrer Datenbank nach Datum abrufen oder was ist Ihr Ziel?

3

yes I want to receive data from my database

4

Hello Melia,

there are 2-ways of how you can get data out of your database.

  1. by using a dataset

  2. directly by quering your data-collection.

  3. using DATASET
    $w . onReady (()=>{ $w ( “#myDataset” ). onReady (()=>{ $w ( “#myDataset” ). getItems ( 3 , 2 ). then (( result )=>{ let items = result . items ; let totalCount = result . totalCount ; let offset = result . offset ;}). catch (( err )=>{ let errMsg = err . message ; let errCode = err . code ;});});}); 2) using a data-collection
    import wixData from ‘wix-data’ ; // … wixData . query ( “myCollection” ). find (). then (( results )=>{ if ( results . items . length > 0 ){ let firstItem = results . items [ 0 ]; //see item below } else { // handle case where no matching items found }}). catch (( err )=>{ let errorMsg = err ;}); With this to functions you are able to get data from your database.
    Of course you have to modify this functions to your own needs.
    For example set the right DATASET or DATA-COLLECTION, depending on which of the 2 opertunitirs you will choose.

  4. To set the current/selected item you can use this one…
    $w . onReady (()=>{ $w ( “#myDataset” ). onReady (()=>{ let itemObj = $w ( “#myDataset” ). getCurrentItem ();});}); All these codes you can also find in the REFERENCE-API…

https://www.wix.com/corvid/reference/wix-dataset.Dataset.html#getCurrentItem

Also take a look here at this little example, which demonstrates how to work with DATE and TIME…
https://russian-dima.wixsite.com/meinewebsite/date-time-onclick

5

Hello Melia,

there are 2-ways of how you can get data out of your database.

  1. by using a dataset

  2. directly by quering your data-collection.

  3. using DATASET

$w.onReady(()=>{$w("#myDataset").onReady(()=>{$w("#myDataset").getItems(3,2).then((result)=>{let items = result.items;let totalCount = result.totalCount;let offset = result.offset;}).catch((err)=>{let errMsg = err.message;let errCode = err.code;});});});
  1. using a data-collection
import wixData from'wix-data';// ...  wixData.query("myCollection").find().then((results)=>{if(results.items.length >0){let firstItem = results.items[0];//see item below}else{// handle case where no matching items found}}).catch((err)=>{let errorMsg = err;});

With this to functions you are able to get data from your database.
Of course you have to modify this functions to your own needs.
For example set the right DATASET or DATA-COLLECTION, depending on which of the 2 opertunitirs you will choose.


3)  To set the current/selected item you can use this one…

$w.onReady(()=>{$w("#myDataset").onReady(()=>{let itemObj =$w("#myDataset").getCurrentItem();});});

All these codes you can also find in the REFERENCE-API…

Also take a look here at this little example, which demonstrates how to work with DATE and TIME…
https://russian-dima.wixsite.com/meinewebsite/date-time-onclick

6

Thank you so much I will look into this

7

Sorry if there are some errors, bad internet-connection at moment.
Will come back later. Good luck.

8

Thanks! I have looked through your great references. Unfortunately, I still do not know how to connect the “val” to “let countDownDate”

$w.onReady( () => {
  $w("#dynamicDataset").onReady( () => {
 let itemObj = $w("#dynamicDataset").getCurrentItem();
 let val = itemObj.AuctionEnd;
  } );
} );

let countDownDate = new Date("val").getTime();
9

Ok, you have a dynamic page where you gets always the current item, when page loads. Then you have a database with the column (reference) “AuctionEnd”.
I assume there you have your DATE , which tells when an Auction has to stop, right?

Just try to understand the flow of your little project.

What often can help in almost every situation ist to create some “CONSOLE-LOGS”. You know what it is? It helps me a lot when i am struggling with some issues.

How to use it?

Well, let’s take your code as example.

$w.onReady( () => {
  $w("#dynamicDataset").onReady( () => {
 let itemObj = $w("#dynamicDataset").getCurrentItem();
 let val = itemObj.AuctionEnd;
  } );
} );

let countDownDate = new Date("val").getTime();

You can add this code here into your own:

console.log() //<<--- with this you start a log, which will be shown in the console-window.

Press F-12 in your google-chrome-browser (in other Browser it could be also another Key-Press) . A window will ioen on the right side. Then you go to console.
Now you are ready for all logs. (You have of course the same possibility when you use the PREVIEW-MODE in your Wix-Editor, there you will also finde a console-log-window.

Ok, what we want to log in our console-window?
We want always to see our outputs for better understanding right?
When you see the results, you will understand better what you are programming.

Now let’s go, let’s do it.

$w.onReady( () => {
    $w("#dynamicDataset").onReady( () => {

 let itemObj = $w("#dynamicDataset").getCurrentItem();
 let val = itemObj.AuctionEnd;

    console.log(itemObj)  //<---- this should now show you the current item
    console.log(val) //<---- should show you in the console-log-window the value of "AuctionEnd" (entry in your database)

  } );
} );

So you have seen the example with DATE & TIME right?

Conclusion…

  1. You are now able to read-out/get data from your database.
  2. What do you get, if you console-log this part of your code?
$w.onReady( () => {
 let countDownDate = new Date("val").getTime();
    console.log (countDownDate)
} );

???

By the way, could you please show a little (related) part of your database?

10

Thank you so much for your help!
I finally got it to work!!

I had to do lots of console log, move scripts and I had a typo. The typo was the main issue :neutral_face:.

I really appreciate all your help!! I am so happy it works now

11

Well done Melia, you did it😁.
That’s the power of console-log :wink:
You are always welcome.

12

Hi,
Thank you very much @yisrael-wix @russian-dima it helps me a lot, but I am stuck now.
everything works just fine but if I want to make the countdown unique for each user profile based on a date in the user’s row in the collection.
how to implement it, please?

This is my code:

import wixUsers from ‘wix-users’ ;
import wixData from ‘wix-data’ ;
import wixWindow from ‘wix-window’ ;

$w . onReady ( function (){
$w ( “#listRepeater” ). show (); //repeater ID
let user = wixUsers . currentUser ;
let userEmail ;
user . getEmail (). then ( ( email ) => {
userEmail = email ;
$w ( “#dynamicDataset” ). onReady (() => {
$w ( “#dynamicDataset” ). setFilter ( wixData . filter ()
. eq ( “email” , userEmail ))
})
});
});

if ( wixWindow . rendering . env === ‘browser’ || wixWindow . viewMode === ‘Preview’ ){

$w ( “#dynamicDataset” ). onReady ( () => {
let theDate = $w ( “#dynamicDataset” ). getCurrentItem ();
let ud = theDate . date ;

let countDownDate = new Date ( ud ). getTime (); // Countdown date and time

let countDown = setInterval ( function () {
let now = new Date (). getTime ();
let timeLeft = countDownDate - now ;
let days = Math . floor ( timeLeft / ( 1000 * 60 * 60 * 24 ));
let hours = Math . floor (( timeLeft % ( 1000 * 60 * 60 * 24 )) / ( 1000 * 60 * 60 ));
let minutes = Math . floor (( timeLeft % ( 1000 * 60 * 60 )) / ( 1000 * 60 ));
let seconds = Math . floor (( timeLeft % ( 1000 * 60 )) / 1000 );

$w ( "#days" ). text  =  ""  +  days ; 
$w ( "#hours" ). text  =  ""  +  hours ; 
$w ( "#minutes" ). text  =  ""  +  minutes ; 
$w ( "#seconds" ). text  =  ""  +  seconds ; 
  **if**  ( timeLeft  <  0 ) { 
    $w ( '#countDown' ). hide (); 
}  **else**  { 
    $w ( '#countDown' ). show (); 
}

}, 1000 );
} );
}