Search code examples
javascriptjqueryhtmlcssfancybox

fancybox popup execute select option

I have a json file exciting an array of images. I have fancy box install and when you click the image an inline div will appear. With in the inline div I display the image and in have a dropdown box to display options for selecting. I idea is to select an option then go to the corresponding page. I can get this to work with links but I want it to use a dropdown feature. No function will execute within the fancy box window. 

function fruitselect() {
      var e = document.getElementById("mySelect");
var strUser = e.options[e.selectedIndex].value;
  alert(strUser);
};
<form>
Select your favorite fruit:
<select id="mySelect" onchange="fruitselect()">
  <option value="apple">Apple</option>
  <option value="orange">Orange</option>
  <option value="pineapple">Pineapple</option>
  <option value="banana">Banana</option>
</select>
</form>

Is there a way to do this?

Solution

  • It is very hard to understand your comment and I do not see any issue with your code: http://codepen.io/anon/pen/pPpVxe?editors=1010

    Also, you can disable "touch" feature if it is causing some trouble:

    <a data-fancybox data-options='{"src": "#content", "touch": false}' href="javascript:;">
  Open demo
</a>