Forum | Appery.io

I am trying to iterate through listItems, following the discussion here:
http://stackoverflow.com/questions/45...

I execute the following code on success of a REST service which maps to the listItems I am interested in iterating through. However, this does not lead to any alert.

var listItems = $("#my_list li");
listItems.each(function() {
alert($(this).text());
});

What might be going wrong here?

Thank you.

Hi Cody,

Please use following code to understand how to iterate through list items:

pre

var list = Appery("mobilelist_33");

var listItems = list.find("li");

for(var i = 0; i < listItems&#46;length; i++){

 //Do with items what you need. 
 console.log("listItems[" + i + "] = " + jQuery(listItems[i]).text().trim()); 

};

&#47;&#47;Logout items count&#46;
console&#46;log("listItems&#46;length = " + listItems&#46;length);

/pre

Regards.

Thank you very much, Yurii!

Regards.

hi Yurii,

I tried the above code with a list component that has the auto dividers on. The result that I get are

listItems[0] = S
testScreen.js:188 listItems[1] = samsung
testScreen.js:188 listItems[2] = H
testScreen.js:188 listItems[3] = hyundai
testScreen.js:188 listItems[4] = K
testScreen.js:188 listItems[5] = kyocera
testScreen.js:188 listItems[6] = S
testScreen.js:188 listItems[7] = samsung open
testScreen.js:188 listItems[8] = R
testScreen.js:188 listItems[9] = renault
testScreen.js:191 listItems.length = 10

How do I differentiate the auto divider? Is there a property that I can check or do I check the length of string and see if is 1 and then assume that is divider? There might be a problem if any of my other list item is of length 1.

thanks

Hi M&M,

Here is a modified code to exclude devieders:

precode

&#47;&#47;Where "mobilelist_258" is your list component name&#46;
var listItems = jQuery('[name="mobilelist_258"] li:not([data-role="list-divider"]')
for(var i = 0; i < listItems&#46;length; i++){
&#47;&#47;Do with items what you need&#46;
console&#46;log("listItems[" + i + "] = " + jQuery(listItems)&#46;text()&#46;trim());
};
&#47;&#47;Logout items count&#46;
console&#46;log("listItems&#46;length = " + listItems&#46;length);

/code/pre

Regards.

hi there! how you guys doing ?

concept:
1/ i load txt msgs in listItems using a service with GET request. I load only txt not to have too much to load.
2/ in each listItem there is button and a image component. when pressing the button, it (shall) fires another service to GET the image att'd to that msg.

logic:
I thought I could for each element of image component set an id in the service mapping when loading data.
then, the img would hv been load to that element.id through getElementById('myElementId').src

error:
however, it returns 'cannot set property src of null'. meaning it doesn't find the element through the id

thks in advance for your advice!

code:
1/ when loading msgs to listItem, img component has code in its mapping to set element.id :

2/ it seems working since the console.log returns element.id

3/ when pressing button 'view image', service will GET data and place into a localStorage. in that LS's mapping it has the following code:

4/ unfortunately, console.log throw the following error msg:

Hi EJLD,

It seem you use "element.id" and it's not correct for that context.

Please try code(like on screen shot) to set "id" attribute.
http://prntscr.com/704j40/direct

Also, please make sure you have set "id" attribute via inspect image elements on the page.

Regards.

Hi Yurii, good job ! it works as expected. thks a lot !
just one question; why context is different ?
cheers

Well, the shortest answer could be this: the element in that context is not an HTML element. It is an object and you are adding an attribute('id' in this case) to that object, which you are later accessing.

Almost / most html elements have an id property. That is not the case with other objects. They don't necessarily need to have an id attribute / property.

thks MnM that s clear to me now