How can I change the object's value with the interface simultaneously?

I have this type of object and when the edit button is clicked I want to change the values found here

let spend = {
          id: this.itemID,
          title: expenseValue,
          quantity: quantity
        }

This object is written into an array and the id value is written as a dataset, then I access the item I want using the dataset property.

 editExpense (item) (
       let id = parseInt (element.dataset.id)
this.itemList [id] // This brings up the object for every item that the edit key was pressed
     } 

but I can’t change the values from the object. How can I achieve this?

I think I would need more to go on. Your function doesn’t make any sense to me. Do you have a repo?

OK, I can see the code, but I guess I don’t understand what you want to happen there. What is your plan for this? I can’t see where you’ve tried to implement an edit and there are a couple of ways to do this - what is it that you want to happen?

As seen in the codes, I turn the text written on the inputs into an object and keep it in an array, and then these objects are written to the interface. What I want is to change these objects later. For example, if “car” was written by mistake at the beginning, we want to change it to “sports car” later. How can we change this both in the interface and within the object?

Right, but really it appears to me that you are storing it in two places - in the itemList but also in the DOM. I’m not a big fan of storing it in two places without a really good reason. But OK…

But in any case, this is a learning forum so we usually don’t just handout answers. I would want to see what you’ve tried. So far, what I see is this:

  editExpense(element) {
    let id = parseInt(element.dataset.id)
    this.showBalance()
  }

OK, so you parse out the id and you show the balance. But what do you have to do here? I think you need to create a new record and insert that into the proper place in your data and in the DOM.

Is that clear? You’re already doing some manipulation of those in the other methods. Are you able to figure out how to change the record in the itemList? Just approach this one step at a time and if you can’t figure out a step, check in with us.

The other problem is that I don’t know what you want to happen when the edit is pressed. Does the app modify the pressed record with the data currently in the input fields? Does a modal pop up with the existing record and they edit it and submit? Do the fields in the record UI turn into editable inputs? What is the UX here? What do you expect to happen?

1 Like