4

I've been looking around and haven't been able to find an answer to this. I can get JQuery Easyautocomplete (http://easyautocomplete.com/) to work with Links, then get it to work with images, but I can't seem to get it to work with both. I'm new to JavaScript. I'm not sure what I'm doing wrong.

Here is my code...

var options = {
    data: [
        {
            "text": "Home",
            "website_link": "http://easyautocomplete.com/",
            "icon": "http://lorempixel.com/100/50/transport/6"
        },
        {
            "text": "Github",
            "website_link": "https://github.com/pawelczak/EasyAutocomplete",
            "icon": "http://lorempixel.com/100/50/transport/6"
        }
    ],

    getValue: "text",

    template: {
        type: "custom",
        fields: {
            website_link: "website_link"
        },
        method: function(value, item) {
            return "<a href=" website_link "><img src='" + item.icon + "' />" + value + "</a>";
        }
    }
};
jQuery("#loan-officer-select").easyAutocomplete(options);

What am I doing wrong here? Any help would be greatly appreciated.

Robert
  • 41
  • 2

1 Answers1

1

check if this is what you want

    var options = {
    data: [
        {
            "text": "Home",
            "website_link": "http://easyautocomplete.com/",
            "icon": "http://lorempixel.com/100/50/transport/6"
        },
        {
            "text": "Github",
            "website_link": "https://github.com/pawelczak/EasyAutocomplete",
            "icon": "http://lorempixel.com/100/50/transport/6"
        }
    ],

    getValue: "text",

    template: {
        type: "custom",
        method: function(value, item) {
            return `<div>
              <img src="${item.icon}" width="50px" height="50px" />
              <a href=${item.website_link}> click me to go to ${value}</a>
           </div>`;
        }
    }
};
jQuery("#loan-officer-select").easyAutocomplete(options);
roni
  • 59
  • 6