seo Question posted in
Some basic information to get you started with this can be found here.

How to update key value in an array of objects? – SEO

This is what I have so far:

var onepage = [{
    name: 'Custom Design',
    hours: 5
  },{
    name: 'Premium Theme',
    hours: 2
  },{
    name: 'SEO',
    hours: 5
  },{
    name: 'Backlink Building',
    hours: 6
  },{
    name: 'Article Writing',
    hours: 7
  },{
    name: 'Copywriting',
    hours: 3
  },{
    name: 'Development',
    hours: 8
  }
]

window.onkeyup = keyup;

var numberofPages;

function keyup(e) {
  numberofPages = e.target.value;
  newHours = [];

  for (var i = 0; i < onepage.length; i++) {
    var totalHours = numberofPages * onepage[i].hours;
    newHours.push(totalHours);
  }
  console.log(newHours);
}
<input type="text" placeholder="Number of Pages" id="pages" value="1">

The user inputs # of pages and the it gets multiplied by hours and pushed into the array newHours and from there I want to update the original object array hours.

I’m not sure how to update it, or does it make sense to create a new array of objects?

Tags:

2

Answers


  1. 0

    You can update the array directly without creating a newArray. Please note, that updating directly hoursof the original array will lead to undesired results. Hence, added a new property calculatedHours

    var onepage = [{name: 'Custom Design',hours: 5},{name: 'Premium Theme',hours: 2},{name: 'SEO',hours: 5},{name: 'Backlink Building',hours: 6},{name: 'Article Writing',hours: 7},{name: 'Copywriting',hours: 3},{name: 'Development',hours: 8}];

window.onkeyup = keyup;

var numberofPages;

function keyup(e) {
  numberofPages = e.target.value;
  newHours = [];

  for (var i = 0; i < onepage.length; i++) {
    onepage[i].calculatedHours = numberofPages * onepage[i].hours;
  }
  console.log(onepage);
}
    <input type="text" placeholder="Number of Pages" id="pages" value="1">
    Login or Signup to reply.
  2. 0

    Just do a simple forEach loop like shown below. I’ve created it so that it gets updated once the user presses the enter key (13) inside the input. I’d suggest to put the listener on the input, not on the window in real code. 

    document.getElementById('foo').addEventListener('keyup', e => {
  if (e.keyCode !== 13) return;
  onepage.forEach(el => el.computed = el.hours * e.target.value);
  console.log(onepage);
})
    <input id="foo">
<script>
var onepage = [
    {
        name: 'Custom Design',
        hours: 5
    },
    {
        name: 'Premium Theme',
        hours: 2
    },
    {
        name: 'SEO',
        hours: 5
    },
    {
        name: 'Backlink Building',
        hours: 6
    },
    {
        name: 'Article Writing',
        hours: 7
    },
    {
        name: 'Copywriting',
        hours: 3
    },
    {
        name: 'Development',
        hours: 8
    }
]
</script>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search