I have a product table where a product can have multiple photos. When you select the code in <select>
it should return all the photos you have registered. How do I do this?
I have a product table where a product can have multiple photos. When you select the code in <select>
it should return all the photos you have registered. How do I do this?
To make an asynchronous request may be easier, but to do in javascript using the new HTML5 attribute "date - *":
function listaFoto(sel) {
var i = sel.selectedIndex;
if(i === 0) return;
// dataset.foto é uma nova API do HTML5, se quiser compatibilidade com IE, tente usar "attributes", mas nao testei
var arrayFotos = sel.options[i].dataset.foto.split(',');
alert(arrayFotos);
}
<select id="opcoes" onchange="listaFoto(this)">
<option value="" data-foto=""></option>
<option value="1" data-foto="foto1a.jpg,foto1b.jpg,foto1c.jpg">Produto 1</option>
<option value="2" data-foto="foto2a.jpg,foto2b.jpg,foto2c.jpg">Produto 2</option>
<option value="3" data-foto="foto3a.jpg,foto3b.jpg,foto3c.jpg">Produto 3</option>
</select>