CODEWITHSUNDEEP
javascriptarraysangularjavascript-objects
Didi
Didi

Reputation: 461

Push all objects after a selected object into an array

I have a web page that returns a list of objects like:

date.pdf
names.csv
address.pdf
age.csv
cost.csv
budget.csv
data.pdf
race.pdf
contractors.csv

When a user checks budget.csv, I want every object with the .csv extension from that point to be pushed into csv_files[]. If they select names.csv, then every .csv including and after names is pushed into the array.

So the only data that gets pushed into the array is from the selected object downwards. How can I implement this?

Current code

const csv_files = []

 $scope.listAllobjects = (err, data) => {

    $.each(data.Contents, (index, value) => {
      if (value.Key.endsWith("csv")) {
        csv_files = [];
}

 // Handle click on selection checkbox
  $("#filesobjects-table tbody").on("click", 'input[type="checkbox"]', (e1) => {
    const checkbox = e1.currentTarget;
    const $row = $(checkbox).closest("tr");
    const data = $tb.DataTable().row($row).data();
    let index = -1;

    // Prevent click event from propagating to parent
    e1.stopPropagation();

    // Find matching key in currently checked rows
    index = $scope.view.keys_selected.findIndex((e2) => e2.Key === data.Key);

    if (checkbox.checked && data.Key.endsWith("csv")) {
     console.log(selected csv)
    }
  });
}

Upvotes: 0

Views: 52

Answers (3)

Rohìt Jíndal
Rohìt Jíndal

Reputation: 27202

Here you go with a pure JavaScript solution (Descriptive comments has been added in the below code snippet).

var contentData = ["date.pdf", "names.csv", "address.pdf", "age.csv", "cost.csv", "budget.csv", "data.pdf", "race.pdf", "contractors.csv"];

var myDiv = document.getElementById("cboxes");

for (var i = 0; i < contentData.length; i++) {
  var checkBox = document.createElement("input");
  var label = document.createElement("label");
  checkBox.type = "checkbox";
  checkBox.value = contentData[i];
  myDiv.appendChild(checkBox);
  myDiv.appendChild(label);
  label.appendChild(document.createTextNode(contentData[i]));
}

// Event to handle the checkbox click
document.getElementById('getResult').addEventListener('click', () => {
  document.getElementById('showResult').innerHTML = getCheckedValues();
});

function getCheckedValues() {
  // filtered out the checked items.
  const element = Array.from(document.querySelectorAll('input[type="checkbox"]'))
  .filter((checkbox) => checkbox.checked).map((checkbox) => checkbox.value);
  
  // element[0] will always return the first checked element and then we are getting index of that.
  const checkedElemIndex = contentData.indexOf(element[0]);
  
  // Slice the content data to get the elements from the checked element index.
  return contentData.slice(checkedElemIndex, contentData.length)
}
<div id="cboxes"></div>

<button id="getResult">Get Result</button>

<pre id="showResult"></pre>

Upvotes: 0

Andrew Parks
Andrew Parks

Reputation: 8087

const list = ['date.pdf','names.csv','address.pdf','age.csv','cost.csv','budget.csv','data.pdf','race.pdf','contractors.csv'];
const selected = 'budget.csv'

const csv_files = list.slice(list.indexOf(selected))

console.log(csv_files)

Upvotes: 1

TKoL
TKoL

Reputation: 13902

There's a few ways, I suppose, to approach this problem, but the most intuitive to me is this:

const csvList = ["date.pdf","names.csv","address.pdf","age.csv","cost.csv","budget.csv","data.pdf","race.pdf","contractors.csv"];
const selectedCsv = 'budget.csv';

function getCsvsAfter(csvList, selectedCsv) {
    const filteredCsvs = [];
    let found = false;
    for (let csv of csvList) {
    if (csv === selectedCsv) found = true;
        if (found) filteredCsvs.push(csv);
    }
    return filteredCsvs;
}

console.log(getCsvsAfter(csvList, selectedCsv));

Iterate over every csv, and when you've hit the one you're trying to match, set a variable called found to true. Once it's true, you can add every following csv onto the list.

Upvotes: 2

Related Questions