Retrieving object from array based on ID

Question

I have an array (myElems) with objects (list items). I'd like to fish out from this array an element with ID matching 'foo'. 'foo' string is currently stored in a var 'targetItem' Last, I need to grab that matching element's position.top

var targetItem = 'foo'; // value of this var is set dynamically
$(myElems).grep(function(ele){
retun ele.id == menuItem;
});
var loc = // [returned from array].position.top;

...yes, I know this is hodgepodge... I don't know how to syntax this

Thanks

EDIT: creation of myElems

var myElems = [];

    $('#menu').children('li').each(function() {
        myElems.push( $(this) ); 
    });

html:

<ul id="menu">
    <li id="foo">FOO ITEM</li>
    <li id="boo">BOO ITEM</li>
</ul>

Is your myElems array of DOM references? Also clarify what you mean by position.top. Do you mean the CSS top attribute? Or do you mean the index of the found element within the array collection? — cbayram
– cbayram, Commented Dec 16, 2013 at 20:57

Ani · Accepted Answer · 2013-12-16 22:00:17Z

1

JS

var ele = $('#foo').attr('id')
var myElems = [];

$('#menu').children('li').each(function() {
    myElems.push( $(this).attr('id') ); 
});

var targetItem = 'foo'; // value of this var is set dynamically
var newelement =  $.grep(myElems, function( ele, i ){
                      return ele == targetItem ;
                     //console.log("This is the position of matched item - ", + i);
                   });

Fiddle: http://jsfiddle.net/Xt6Wh/2/

Check if ele.id is getting the required value. In the fiddle I am taking the value from a div - just to show that the logic works. I am not sure where you are getting the ele.id from. Hence I took the assumption.

edited Dec 16, 2013 at 22:00

answered Dec 16, 2013 at 20:58

Ani

4,5434 gold badges28 silver badges32 bronze badges

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

10 Comments

user3024007 Over a year ago

how do I use the returned value? close it in a var for instance to use elsewhere?

user3024007 Over a year ago

for some reason it would throw error on $(myElem).grep... so I had to use $.grep(myElem, function... (object has no method grep). Still, newelement returns [], empty array?

Ani Over a year ago

Sorry, I made a mistake...that's the correct format...Are you getting the value of ele.id correct ?

user3024007 Over a year ago

my array hold objects (list elements, not strings as your example), would that be of importance?

Ani Over a year ago

Can you post the array ?

|

Zarathuztra · Accepted Answer · 2013-12-16 20:54:23Z

0

Best way I can think of off hand is to just iterate over the array and go from there using grep

$.grep(myElems,function(value,id){
    return id == targetItem;
});

Let me know if that works for you, else I'll edit my answer based on your comments. This is the best I can give you given your code.

answered Dec 16, 2013 at 20:54

Zarathuztra

3,2411 gold badge23 silver badges34 bronze badges

Comments

Pawel Miech · Accepted Answer · 2013-12-16 20:58:18Z

0

In vanilla js.

el = myElems.filter(function (elem) {
    return elem["id"] == "foo";
})

This will get you an array of elements matching "foo". Then you can check if you have something there:

if(el.length > 0) el = el[0]

answered Dec 16, 2013 at 20:58

Pawel Miech

7,8624 gold badges41 silver badges58 bronze badges

Comments

cbayram · Accepted Answer · 2013-12-16 21:20:45Z

0

// To get the correct element you can just stick to CSS id selector:
var target = $('#menu').children('li#' + targetItem);
// to get the CSS top value you can do
var top = target.css("top");

Of course, you can check for the target.length if there is a case where no target element is present.

http://jsfiddle.net/jeVSJ/

edited Dec 16, 2013 at 21:20

answered Dec 16, 2013 at 21:15

cbayram

2,25912 silver badges9 bronze badges

2 Comments

user3024007 Over a year ago

I have to reach out to the array as that is what is created dynamically and holds the position value at the time the given item is pushed to the array

cbayram Over a year ago

@user3024007 according to your generation code of the myElems, this will produce the same result. Your CSS top attribute value is referenced through the DOM reference regardless how you obtain it. Perhaps you can elaborate.

Collectives™ on Stack Overflow

Retrieving object from array based on ID

4 Answers 4

10 Comments

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

10 Comments

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related