[SOLVED] Save information using default settings and code

Hi everyone, hoping you’re doing well! :grin:

Here’s the case: I use the default settings to save info to a database (this data will be uploaded by a user). So then, I have a folio number that is calculated automatically, using code. I want that folio number to be saved at the same time and row when the user uploads the info.

As you can see, when I use the default settings to save information and code to save the folio number (by apart), the information is saved, but in different rows

How can I save or merge the information to have just a single row? Using both, default settings and code

I will greatly appreciate your collaboration

Thank you!

It is saved in different rows, because you are generating to different RUNTIMES.

  1. The first runtime running by default (coming from DATASET and settings inside PROPERTY-PANEL)

  2. Second one comes from CODE!

Both of them running its own way, this is why you get this splitted result.

To solve this error, you will need to use the “beforeSave()”-hook(code) to modify your calculations before you click the SAVE (SUBMIT)-button.

And the actions also can be only running CODE-SIDED or using the dataset-connection and property-panel setup.

Surely you will use a DATASET and a button (with submit function), although you did not mentioned this in your description. Also you do not provide any code which you are using on your page.

So it is difficult to give you a right answer. But my assumtion should be the right way.
It looks like you are saving 2 times.

Another issue → if you do not wait until your DATASET gets ready first.

Hi, :grin:

Thank you so much for your help!

I get the idea, I just can’t find the way to execute it properly

The code I use for this looks like this:

import wixData from ‘wix-data’ ;

export function save_click ( event ) {

$w . onReady ( **function**  () { 
   wixData . query ( "Extrusora1" ) 
   . count () 
   . then (( result ) => { 
       $w ( '#folio' ). text  =  "T-"  +  result . toString () 
   }) 
}); 

**let**  toInsert  = { 
    "title" :  $w ( '#folio' ). text , 
} 

wixData . insert ( "Data_base" ,  toInsert ) 

}

What do you recommend me to do/use in this case?

I’ve never used hooks before in code, I just want to merge both submissions in just one single row (the info that is calculated in the code and the info that the user provides coming from DATASET and settings inside PROPERTY-PANEL)

Thank you so much!

My first question is…

  1. Why do you use —> “count” instead of → “find” ???

When you would use find(), you would not only get the total counts, you would get all the data…

Example…

As you can see → “_totalCount” is included in the normal query.
You also can see that the behaviour and corresponding results of wix-data has been changed. Look like → Wix-Data gets more intelligent, or at least it starts to provide more options.

How ever, an original query is limited to 50-items, as you can see on the following pic…


But you also get the TOTAL-COUNT of all included items inside of your DATABASE.

So, i still do not understand why you used → “COUNT()” instead of using “FIND()”.

Second question; Why the hell working with "EXPORT-FUNCTIONS ?

Change your code-structure to the following…

import wixData from 'wix-data';


let DATABASE = "Exercise-Videos";
let dbField = ""; 
let value;

$w.onReady(()=>{
    $w('#mySubmitButtonIDhere').onClick(()=>{
        wixData.query(DATABASE)
        .find()
        .then((results) => {
            console.log(results);
            //$w('#folio').text = "T-" + result.toString()
        }).catch((err)=>{console.log(err);});
    });
});

Or if you want to have your function SEPARATED…

import wixData from 'wix-data';

let DATABASE = "Exercise-Videos";
let dbField = ""; 
let value;

$w.onReady(()=>{
    $w('#mySubmitButtonIDhere').onClick(()=>{
       myFunction();
    });
});

function myFunction() {
     wixData.query(DATABASE)
    .find()
    .then((results) => {
        console.log(results);
        //$w('#folio').text = "T-" + result.toString()
    }).catch((err)=>{console.log(err);});
}

Or even better to generate it as a RETURING-FUNCTION…

import wixData from 'wix-data';


let DATABASE = "Exercise-Videos";
let dbField = ""; 
let value;

$w.onReady(()=>{
    $w('#mySubmitButtonIDhere').onClick(async()=>{
        let dbData = await get_dbData();
        console.log("DB-Data: ", dbData);
        //you will get your results from database first 
        //before code continues....
    });
});


function get_dbData() {
    return wixData.query(DATABASE).find()
    .then((results) => {return results;})
    .catch((err)=>{console.log(err);});
}

But still something missing right?
What about your DATASET ???
You just forgot it???

import wixData from 'wix-data';

let DATABASE = "Exercise-Videos";
let dbField = ""; 
let value;

$w.onReady(()=>{console.log("Page ready...");
    $w('#myDatasetIDhere').onReady(()=>{console.log("Dataset ready...");
        $w('#mySubmitButtonIDhere').onClick(async()=>{console.log("clicked");
            let dbData = await get_dbData();
            console.log("DB-Data-Results: ", dbData);
        });
    });
});


function get_dbData() {console.log("Query running...");
    return wixData.query(DATABASE).find()
    .then((results) => {return results;})
    .catch((err)=>{console.log(err);});
}

Do we have now the right CODE ???
What do you think ?

Ok, let’s think about it…

  1. Everything starts on a click onto your SUBMIT-BUTTON, right? (RIGHT!!!)
  2. get_dbData() starts seraching for results and we get all out results, right? (RIGHT !!!)
  3. But wait !!! Did we forgot one more time something? YES WE DID !!!
  4. You SUBMISSION runs also through the PROPERTY-PANEL doing its SUBMISSION, didn’t you also connected your button by DATASET, which is connected to your collection ?

This is exactly the point of your problem → 2-in parallel running functions.

SOLUTION —> before the automatic DATASET-SUBMISSION starts saving all the data (don’t forget → it happens immediately by a click onto the SUBMISSION-BUTTON), your RESULTS of the Wix-Data must already be prepared !

That means we need to tell the automatic save-process, that it has to WAIT —> BEFORE —> it starts to —> SAVE !

--------> onBeforeSave();

So, we need to change our CODE… to…

import wixData from 'wix-data';

let DATABASE = "Exercise-Videos";
let dbField = ""; 
let value;

$w.onReady(()=>{console.log("Page ready...");
    $w('#myDatasetIDhere').onReady(()=>{console.log("Dataset ready...");
        $w('#mySubmitButtonIDhere').onClick(()=>{
            console.log("clicked"); 
            $w("#myDataset").save();           
        });
    });

    $w("#myDatasetIDhere").onBeforeSave(async()=> {
        console.log("Continuing save");
        let dbData = await get_dbData();
        console.log("DB-Data-Results: ", dbData);

        //Now, here you can set all your wished VALUES to the right FIELDS, to be saved.
        $w("#myDataset").setFieldValues( {
            "title":  "New Title",
            "name":   "New Name"
        });
    });
});


function get_dbData() {console.log("Query running...");
    return wixData.query(DATABASE).find()
    .then((results) => {return results;})
    .catch((err)=>{console.log(err);});
}

Does this make sense ???

Yes! —> Because now you click the save button and the save-process starts!
BUT WAIT, there is someone faster than the SAVING-PROCESS !!!
Take a look into the sky,…
…is it a JET ???
…is it a ROCKET ???
… is it —> SUPER-MAN ???

Nooooooo !!! ----> It’s the ---->onBeforeSave()-HOOK <—

I think the rest of the story is clear and easy to understand. :wink:

This HOOK must be a HERO !!!

Depending on your project situation, you can do the query also after page is ready to safe time. So you don’t have to wait for query-results after click-action.
In this case → your results already would be prepared to be used.

This is just a simple example, you can expand the code for your own needs.

This two were not used in this example…

let dbField="";
let value;

You would need them when using some filtering functions, like…

  1. eq(dbField, value);
  2. contains(dbField, value);
  3. hasSome…
  4. hasAll…
  5. and so on…
1 Like

Wow!

Thank you for all your comments, instructions and for taking me step by step

It really function, now the information is being saved in one single row

All I can say is: awesome, thank you so much!

:grin:

1 Like