Member Avatar for wish02

I have a drop down menu and i'm also using an iframe. how do i get the value of the drop down selected value if the url doesn't change at all? it is always the main page's url that is shown. HELP!:) thanks!

  • 2 Contributors
  • 2 Replies
  • 75 Views
  • 9 Hours Discussion Span
  • Latest Post Latest Post by wish02

Dani AI

Generated

A few practical ways to grab a <select> value from inside an iframe depend on whether the iframe and parent share origin and whether you want the value only in the browser or available to PHP on the server. is correct that the iframe URL will not reflect the inner state. 's server-side idea is valid for persistence, but for immediate client-side access use one of these approaches.

If both pages are same-origin, call a function on the parent directly from the iframe. Example:

<!-- parent page -->
<script>
function receiveSelect(v){
  console.log('From iframe:', v);
  // update parent UI or store value
}
</script>
<iframe src="child.html"></iframe>
<!-- inside iframe -->
<select id="s">...</select>
<script>
document.getElementById('s').addEventListener('change', function(){
  window.parent.receiveSelect(this.value);
});
</script>

If they are cross-origin, use cross-document messaging with postMessage and always check origins. Example:

/* parent */
window.addEventListener('message', function(e){
  if (e.origin !== 'https://trusted-iframe.example.com') return;
  if (e.data && e.data.type === 'select') {
    console.log('selected:', e.data.value);
  }
});
/* iframe */
window.parent.postMessage({type:'select', value: this.value}, 'https://parent.example.com');

Also consider writing to localStorage (same-origin) and listening for the storage event, or sending the value to PHP via fetch/XHR to persist it server-side. Read more about postMessage and same-origin rules on MDN: postMessage and Same-origin policy. Validate origins in listeners and avoid using "*" for targetOrigin in production.

Recommended Answers

All 2 Replies

Member Avatar for meffe

Since you are using php, i would suggest you put the values in Sessions or Cookies.

Member Avatar for wish02

how do i get the value of the selected in drop down? i plan to use onChange event.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.