Using Chosen's search box causes images to disapeer until dropdown is reopened

[UntouchedWagons]

If you go to http://testing.mcresourcecalculator.info/ and choose "Minecraft Forge" in the first drop down, then enter 'Water' into the search box of the second drop-down, the water icon disappears until you close the drop down. Clearing the search box does not restore the images either. I'm using Image-Select 1.7 with Chosen 1.5.1, jQuery 2.2.3

[iLLysion]

I have the same issue

[websemantics]

This has been an issue with Chosen for a while, check https://github.com/websemantics/Image-Select/issues/19 .. there is a pending fix https://github.com/harvesthq/chosen/pull/2373 .. I've asked for an update, stay tuned,

[iamcal]

fix will now be either https://github.com/harvesthq/chosen/pull/1626 or https://github.com/harvesthq/chosen/pull/2356

maybe. one day.

[websemantics]

Thanks for the update @iamcal

[donni106]

Is there something new on this? Images also disappear if the search box is disabled but the user presses some keys. Only up/down are working as they are proper inputs to navigate the list items.

[shablam]

Hi, I thought I would help out. I am using this plugin here: http://websemantics.github.io/Image-Select/. So for me I like that plugin but same issue the image would disappear after searching. I am capable of programming although not setup for this hard core debugging. In any case I managed to make the image come back after the search. It works.. because I can do it.

You have to hack the chosen.jquery.js. You can minimize it afterwords if you want.
Ok, so the file ImageSelect.jquery.js already has a "chosen:filter" event listener in place. So I added in a trigger for the filter event. Then it simply calls the the function in the ImageSelect file after the search result is updated. Keep in mind I am not taking into account groups or anything like that ok. This is just for my needs and maybe this will work fine for you as well.

Look for the function below and replace it with this. Version 1.8.2, chosen.jquery.js. I am sure there is some genius to make this all work better but this works for me.

Chosen.prototype.update_results_content = function(content) {
      	this.search_results.html(content);
    	return this.form_field_jq.trigger("chosen:filter", { //9-29-17 added in to replace images after search.
        	chosen: this
      	});
};

I don't have time for a jsfiddle. Hope this helps you. It is super easy to do but took several hours to figure out. I did make custom css for my needs but you can hack that as well. Take it easy.