I am calling this function on add button from my PHTML. On click of add button I want to show image of selected fruit in <div>
.
function moveoutid() { var sda = document.getElementById('availableFruits'); var len = sda.length; var sda1 = document.getElementById('orderFruits'); for(var j=0; j<len; j++) { if(sda[j].selected) { alert(baseUrl+"/img/"+sda.options[j].value+".jpg"); var img1=document.createElement('img').src=baseUrl+"/img/"+sda.options[j].value+".jpg"; var di=document.getElementById('d'); di.appendChild(img1); var tmp = sda.options[j].text; var tmp1 = sda.options[j].value; sda.remove(j); j--; var y=document.createElement('option'); y.text=tmp1; try { sda1.add(y,null); } catch(ex) { sda1.add(y); } } } }
In this code I have created <img>
tag and passing image path to src
, to show selected image on web page. It is correctly taking path of images but it is not appending <img>
tag and not displaying image on web page.
Advertisement
Answer
Your problem is, most likely, in this line:
var img1=document.createElement('img').src=baseUrl+"/img/"+sda.options[j].value+".jpg";
This creates an element, assigns the src
property to it and then assigns the value of this src
property to variable img1
. Instead, you should do this in two lines:
var img1 = document.createElement('img'); img1.src = baseUrl+"/img/"+sda.options[j].value+".jpg";