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>
.
JavaScript
x
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:
JavaScript
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:
JavaScript
var img1 = document.createElement('img');
img1.src = baseUrl+"/img/"+sda.options[j].value+".jpg";