How to return data in a <select> tag?

Asked

Viewed 360 times

0

I have a product table, where a product can have several photos. When the code is selected in the <select> it should return all registered photos. How do I do this?

php javascript html

1 answer

2

make an asynchronous request may be easier, but can be done 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>

Browser other questions tagged php javascript html

You are not signed in. Login or sign up in order to post.