Wix data update issue

Ask the community
,
1

I have a form to collect user data, and I want to be able to update collection fields for existing users or add new records for new users. The user can use a pulldown box to select their name from the collection (this was pre-loaded with a collection query). Right now I’m struggling with “update” but I might be back soon to talk about “Insert”.
I capture the ID of the record, use wixData.get() to grab the record, update the field in question, and use wixData.update() push it back to the collection. No errors are thrown by the code, but nothing is getting updated in the colleciton. I used some console.log() messages to check the ID that I grabbed from the original query and the ID that is being used for the Get-Update functions.
The code below has the following:

  • Collection is named “TV”
  • “full” is the field name in the collection, and #dbFullName is the user input dropdown box. These two things I use to get the current ID (maybe there’s a better way to do this?)
  • “lastName” is the field in the collection that I’m trying to update (for testing, but eventually I want users to be able to update any field).
    The code:
    export function cmdUpdate_click(event) {
    var id; // define variable for the record ID
    // run query to grab the record for the current user.
    // User selects their name in the #dbFullName dropdown box
    wixData.query(“TV”)
    .contains(“full”, $w(“#dbFullName”).value)
    .find() // Run the query
    .then(res => {
    // grab the id from the current page of the query
    if(res.items.length > 0){
    id = res.items[res.currentPage][“_id”];
    console.log(id)
    }
    });
    wixData.get(“TV”, id)
    .then( (item) => {
    item.lastName = $w(“#tbLastName”).value; // updated last name.
    //I’ve also tried hardcoding “Smith” for the value, but still not update…
    wixData.update(“TV”, item);
    } )
    .catch( (err) => {
    let errorMsg = err;
    } );

Does anyone see a problem with the code, or if there are questions about setup of the page, etc, I can provide more info. I’ve also tried an alternative method, shown below, but still no update of the collection.

export function cmdUpdate_click(event) {
var id; // define variable for the record ID
// run query to grab the record for the current user.
// User selects their name in the #dbFullName dropdown box
wixData.query(“TV”)
.contains(“full”, $w(“#dbFullName”).value)
.find() // Run the query
.then(res => {
// grab the id from the current page of the query
if(res.items.length > 0){
id = res.items[res.currentPage][“_id”];
console.log(id)
}
});
let toUpdate = {
“id”: id,
“full”: $w(“#tbLastName”).value + “, " + $w(”#tbFirstName").value,
“firstName”: $w(“#tbFirstName”).value,
“lastName”: $w(“#tbLastName”).value,
“email”: $w(“#tbEmail”).value,
“phone”: $w(“#tbPhone”).value,
“gender”: $w(“#rbGender”).value,
“homeCourse”: $w(“#dbHomeCourse”).value
};
wixData.update(“TV”, toUpdate)
.then( (results) => {
let item = results;
})
. catch ( (err) => {
let errorMsg = err;
});
}

Can anyone help with this?

2

Code does not necessarily execute sequentially in a web program. That’s something that you will need to wrap your head around. In your alternative update code above, when the toUpdate code executes the value of the variable “id” is not known yet. That’s because the query above has not finished, but that did not stop the code below it from continuing to execute. Check out this article on this subject.

I’ve restructured how you did this into a separate function utilizing the async approach. You can only use await in an async function, so putting all the code in a button click event is not possible.

Lastly, I noticed that your toUpdate above did not reference the actual id field correctly. It’s name is “_id”, so it should be “_id”: id and not “id”: id.

You may have to tweak this a little, but you should be fairly close to getting it functioning the way that you had hoped.

export function cmdUpdate_click(event) {
UpdateRecord();
}

async function UpdateRecord() {
var id = “”; // define variable for the record ID
const res = await wixData.query(“TV”).contains(“full”, $w(" #dbFullName “).value).find();
if (res.items.length > 0) {
id = res.items[res.currentPage][”_id"];
console.log(id);

let toUpdate = {
“_id”: id,
“full”: $w(" #tbLastName ").value + “, " + $w(” #tbFirstName “).value,
“firstName”: $w(” #tbFirstName “).value,
“lastName”: $w(” #tbLastName “).value,
“email”: $w(” #tbEmail “).value,
“phone”: $w(” #tbPhone “).value,
“gender”: $w(” #rbGender “).value,
“homeCourse”: $w(” #dbHomeCourse ").value
};
wixData.update(“TV”, toUpdate)
.then( (results) => {
let item = results;
})
. catch ( (err) => {
let errorMsg = err;
});
}
}

3

Super helpful, thank you so much, Anthony. I used the Async function and “await” on this section of code and several others where I needed things to execute in serial fashion, and it worked beautifully. I wouldn’t have thought to break the “on_click” and “on_change” functions into async function call, so I learned something new.