3

Doing a bit of research I now know I have to write the cookie of the selected option. then read the cookie to retrieve the value.

I found a similar question but couldn't figure out how to implement the code from the answer

Link to question

<html>
<head>
<title>dropdown remember selection test</title>
</head>
<body>

<iframe id="stream_iframe" marginwidth="0" marginheight="0" width="854"   height="480" scrolling="no" allowtransparency="true" frameborder="0" framespacing="0" name="stream_iframe" src="http://vaughnlive.tv/embed/video/moviebay"></iframe> 

<form> 
<select name="options" onchange="document.getElementById('stream_iframe').src = this.options[this.selectedIndex].value">
<option>SELECT STREAM
<option value="https://streamup.com/rooms/jumanjijoes-Channel/plugins/video/show?startMuted=false">Jumanjijoe</option>
<option value="http://vaughnlive.tv/embed/video/whenlinkattacks">Whenlinkattacks</option>
<option value="https://streamup.com/rooms/docblus-Channel/plugins/video/show?startMuted=false">Docblu</option> 
<option value="http://vaughnlive.tv/embed/video/karenwaifu">Karenmaiwaifu</option>
<option value="http://vaughnlive.tv/embed/video/ninjatart">Nightsanity</option>
<option value="http://vaughnlive.tv/embed/video/frightfest0001">Frightfest0001</option> 
<option value="http://vaughnlive.tv/embed/video/anime_hq">Anime HQ</option>
<option value="http://vaughnlive.tv/embed/video/moviebay">MovieBay</option>
<option value="http://vaughnlive.tv/embed/video/freakyfetish101">Horror Movie</option>
<option value="http://vaughnlive.tv//embed/video/111aaacharkmovies">111aaacharkmovies </option> 
</select>
</form>

</body>
</html>

I managed to create a dropdown menu that will change the iframe SRC. I just need it to remember what they select on refresh or browser exit.

Improve this question

1 Answer 1

Reset to default
1

For this when user selects the value store the value to either local/or session storage of your browser and when user reopens first check whether local storage has the value or not if yes select the value using jquery.

// Store
localStorage.setItem("lastname", "Smith");
// Retrieve
document.getElementById("result").innerHTML = localStorage.getItem("lastname");

You can see how to use local storage at w3schools: http://www.w3schools.com/html/html5_webstorage.asp

Edited:

Find Complete code Here

<iframe id="stream_iframe" marginwidth="0" marginheight="0" width="854" height="480" scrolling="no" allowtransparency="true" frameborder="0" framespacing="0" name="stream_iframe" src="http://vaughnlive.tv/embed/video/moviebay"></iframe> 

<form> 
<select name="options" onchange="callMe(this);" id="selectMovie">
<option>SELECT STREAM
<option value="https://streamup.com/rooms/jumanjijoes-Channel/plugins/video/show?startMuted=false">Jumanjijoe</option>
<option value="http://vaughnlive.tv/embed/video/whenlinkattacks">Whenlinkattacks</option>
<option value="https://streamup.com/rooms/docblus-Channel/plugins/video/show?startMuted=false">Docblu</option> 
<option value="http://vaughnlive.tv/embed/video/karenwaifu">Karenmaiwaifu</option>
<option value="http://vaughnlive.tv/embed/video/ninjatart">Nightsanity</option>
<option value="http://vaughnlive.tv/embed/video/frightfest0001">Frightfest0001</option> 
<option value="http://vaughnlive.tv/embed/video/anime_hq">Anime HQ</option>
<option value="http://vaughnlive.tv/embed/video/moviebay">MovieBay</option>
<option value="http://vaughnlive.tv/embed/video/freakyfetish101">Horror Movie</option>
<option value="http://vaughnlive.tv//embed/video/111aaacharkmovies">111aaacharkmovies </option> 
</select>
</form>
<script>
function callMe(obj){
localStorage.setItem("selectedStream",obj.options[obj.selectedIndex].value);
document.getElementById('stream_iframe').src = obj.options[obj.selectedIndex].value;
}
document.getElementById("stream_iframe").src = localStorage.getItem("selectedStream");
document.getElementById("selectMovie").value = ""+localStorage.getItem("selectedStream")+"";
</script>
Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

I know I have to store the values problem is i don't know how with a form would it be something like this? // Store localStorage.setItem("selectedStream", "value"); // Retrieve document.getElementById("stream_iframe").innerHTML = localStorage.getItem("selectedStream");
I haved added the complete code. Copy it to html file and run it on browser.
Thank you looking through the code i understand it better now thank you. the src becomes null at first run though.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.