Help get this topic noticed by sharing it on Twitter, Facebook, or email.

Change list image based on value in JS

Hello,

I would like to know if there is a way to change the 'Image' that can be added to a list item, using JS. I can't seem to find the correct syntax to access the 'Image' of the mobilelist. To be clear, I would like item(i) in the list to be given an image(i).

Thanks!

Yoni
1 person has
this question
+1
Reply
  • Hello Yoni,

    Please clarify, what project type do you use there?
    Do you need to change these images, using the mapping to the list component and data from the database?
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated indifferent, undecided, unconcerned kidding, amused, unsure, silly happy, confident, thankful, excited

  • Sorry for not being clear.

    I am working on a JQuery mobile app. Originally what I wanted to do is the following:

    I am mapping data to a mobile list from an APIExpress success event. For each 'system' in my list, I want a small colored dot to appear as the image. The color of the dot will change based on the data that is mapped for each list. However, in order to get this 'data', I need to run another APIExpress. Thus, the code I am proposing in JS is to loop through all of the lists, call the APIExpress function each time, and return the color dot image url based on the value:

    // Loop through all systems
    var Systems = localStorage.getItem("systems");
    Systems = JSON.parse(Systems);
    var numSys = Systems.length;
    var names = [];
    var alarmTags = [];
    var onSuccess = function(data){
    console.log(data);
    };
    for (var i=0;i attribute of the mobileList element?

    Thanks!
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated indifferent, undecided, unconcerned kidding, amused, unsure, silly happy, confident, thankful, excited

  • Please run all requests before making the mapping and save results to the Storage variable.

    After that you can you can use the JS code on the mapping arrow, which will add the specific color dot by adding/removing the CSS class, like:
    if (value.color === "red"){
    $(element).addClass("red");
    } else {
    $(element).removeClass("red");
    }
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. sad, anxious, confused, frustrated indifferent, undecided, unconcerned kidding, amused, unsure, silly happy, confident, thankful, excited