2

Today, I'm trying to get the list of javascript index based from the selected data id that I have.

I'm following this guide from https://buefy.org/documentation/table/#checkable where it needs something like this: checkedRows: [data[1], data[3]] to able to check the specific row in the table.

What I need to do is to check the table based from my web API response.

I have this sample response data.

response.data.checkedRows // value is [{id: 1234}, {id: 83412}]

and I have the sample data from the table.

const data = [{
    id: 1234,
    name: 'Jojo'
},{
    id: 43221,
    name: 'Jeff'
},{
    id: 83412,
    name: 'Kacey'
}]

So basically, I need to have something, dynamically, like this: checkedRows: [data[0], data[2]] because it matches the data from the response.data.checkedRows

So far, I tried using forEach

let selectedIndex = [];
response.data.checkedRows.forEach((d) => {
     this.data.forEach((e) => {
         if (d.id=== e.id) {
             // need the result to be dynamic depending on the response.data.checkedRows
             this.checkedRows = [data[0], data[2]]
         }
     });
});

I'm stuck here because I'm not sure how can I get the index that matches the selected checkedRows from response. Any help?

1 Answer 1

2

Map the response checkedRows, and in the callback, .find the matching object in the array:

const checkedRows = [{id: 1234}, {id: 83412}];

const data = [{
    id: 1234,
    name: 'Jojo'
},{
    id: 43221,
    name: 'Jeff'
},{
    id: 83412,
    name: 'Kacey'
}];

const objs = checkedRows.map(({ id }) => (
  data.find(obj => obj.id === id)
));
console.log(objs);

If there are a lot of elements, you can use a Set of the IDs to find instead to decrease the computational complexity:

const checkedRows = [{id: 1234}, {id: 83412}];

const data = [{
    id: 1234,
    name: 'Jojo'
},{
    id: 43221,
    name: 'Jeff'
},{
    id: 83412,
    name: 'Kacey'
}];

const ids = new Set(checkedRows.map(({ id }) => id));
const objs = data.filter(obj => ids.has(obj.id));
console.log(objs);

Sign up to request clarification or add additional context in comments.

5 Comments

Both work. If you're not using a Set, you can filter the data by whether .some of the checkedRows has a matching ID, or you can map the checkedRows and .find the matching data element.
Thanks for the helpful answer. But how can I get the index of the data based from my response.data.checkedRows like this? and put it inside the local variable of checkedBox?
Like this this.checkedRows = [data[0], data[2]] but dynamically
Both snippets in my answer already result in the [data[0], data[2]] you're looking for - there's no need to find the indexes specifically, you just need the matching objects
Ohh I understand now. Thanks for the new learning @CertainPerformance. Stay safe!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.