CODEWITHSUNDEEP
javascript
user1009749
user1009749

Reputation: 63

Updating multiple array elements at once Javascript

I am trying to update multiple elements at once in a multidimensional array/object and having errors with .push and other options I have tried. 

 var FEtypes= {
    textTemplate: {
       type :"Text",
       size : 50,
       required : "no",
       FEadd : '<input>', 
       label : 'Label',
       top : 0, 
       left : 0
    }, 
    textareaTemplate: {
       type : "Textarea",
       cols : 30,
       rows : 5,
       FEadd :'<textarea>' 
    }
 }

This works, but trying to do in one line.

 FEtypes[1].left = someVariable1;
 FEtypes[1].top = someVariable2;

I have been unsuccessful with:

 FEtypes[1].push( {left:someVariable1, top:someVariable2} );

I keep getting an error that this is not a function or it does nothing.

Upvotes: 0

Views: 3452

Answers (5)

milahu
milahu

Reputation: 3609

in modern javascript

Object.assign(FEtypes[1], {
  left: someVariable1,
  top: someVariable2
})

// FEtypes[1].left = someVariable1;
// FEtypes[1].top = someVariable2;

Upvotes: 0

abhisekpaul
abhisekpaul

Reputation: 515

try this using lodash or underscore: 

_.chain(FEtypes).map(item => {
      item.left = item.type === "Text" ? someVariable1 : item.left;
      item.top = item.type === "Text" ? someVariable2 : item.top;
      return item;
    });

Upvotes: 0

Adam Rackis
Adam Rackis

Reputation: 83376

FEtypes is an object, not an array. Push is only available on arrays.

If you want to store this structure in an array, it would look something like:

var FEtypes= [
      {type :"Text", size : 50,  required : "no", FEadd  :'<input>', label : 'Label', top : 0, left : 0}, 
      {type : "Textarea", cols : 30,  rows : 5,FEadd :'<textarea>' }
];

Then

FEtypes[1].left = someVariable1;
FEtypes[1].top = someVariable2;

If you want to modify multiple properties at once, the jQuery extend function will get you what you want:

$.extend(FEtypes[1], {left:someVariable1, top:someVariable2});

But I think your original structure is more suitable. Just ditch arrays, and do this:

FEtypes.textareaTemplate.left = someVariable1;
FEtypes.textareaTemplate.top = someVariable2;

Or, again, with just one line with jQuery:

$.extend(FEtypes.textareaTemplate, {left:someVariable1, top:someVariable2});

Upvotes: 6

jfriend00
jfriend00

Reputation: 708046

FEtypes is an object and it has two properties textTemplate and textareaTemplate. It is not an array and does not have a property [1]. As such, you can't use .push() or [1].

The proper way to access the .left and .top parameters or the textareaTemplate property is this:

FETypes.textareaTemplate.left = someVariable1;
FETypes.textareaTemplate.top = someVariable2;

or for textTemplate, it would be this:

FETypes.textTemplate.left = someVariable1;
FETypes.textTemplate.top = someVariable2;

Both the textareaTemplate and textTemplate properties are objects. If you wanted to replace the entire object (thus replacing all other properties on the object), you could do this:

FETypes.textTemplate = {left: someVariable1, top: someVariable1};

But, when doing that, you would be replacing the entire textTemplate property so it would have no other properties besides left and top. Any prior properties like size or required would be wiped out by the new assignment.

If you want to update just the left and top properties leaving the others in place, you have to assign to them individually - there is no shortcut unless you write a function to do so like this:

function updatePosition(obj, leftPos, topPos) {
    obj.left = leftPos;
    obj.top = topPos;
}

and then call that function like this:

updatePosition(FETypes.textareaTemplate, someVariable1, someVariable2);

Upvotes: 2

PointedEars
PointedEars

Reputation: 14980

FEtypes does not refer to an Array instance. As a result, it has no 1 property, and undefined, which is the result of FEtypes[1] has no properties at all. Your code does not, cannot work. Check the error console.

Upvotes: 0

Related Questions