Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Feb 2012
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Use Javascript variable in iframe src ??

    Hi, new to the forum (and Javascript coding). I hope someone can help as this is driving me nuts...

    I want my website to display the content of another webpage in an iframe. the other webpage extension will change each day (e.g. 'www.example.com/16_02_2012.html' would be today's file to view, 'www.example.com/15_02_2012.html' would have been yesterday's etc.).

    I have worked out some code to grab today's date and create the web address as a variable. how do i then use that variable in the <iframe src="??"> when someone click a link to "update the iframe"?

    Here is my code so far... I would really appreciate some help!!! :s


    <html>
    <script>

    function getMonth() {
    var now = new Date();
    var month = now.getMonth();
    return month < 10 ? "0" + (month+1) : month+1;
    }

    function getDay() {
    var now = new Date();
    var day = now.getDate();
    return day < 10 ? "0" + (day) : day;
    }

    var month = getMonth();
    var day = getDay();
    var year=new Date();
    var address = "http://www.example.com/" + day + "_" + month + "_" + year.getFullYear() + ".html";

    function iFrameWrite(id, url){
    document.getElementById(id).src = url;
    }

    </script>


    <iframe id="info" width="800px" height="800px"></iframe><br />

    <a href="#" onclick="javascript:iFrameWrite('info', 'address')">Update the Iframe</a>


    </html>

  • #2
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,398
    Thanks
    12
    Thanked 570 Times in 563 Posts
    You almost had it :-)

    Code:
    function iFrameWrite(id){
       var month = getMonth();
       var day = getDay();
       var year=new Date();
       var address = "http://www.example.com/" + day + "_" + month + "_" + year.getFullYear() + ".html";
       document.getElementById(id).src = address;
    }
    
    <a href="#" onclick="javascript:iFrameWrite('info')">Update the Iframe</a>

  • Users who have thanked devnull69 for this post:

    dookjam (02-16-2012)

  • #3
    New to the CF scene
    Join Date
    Feb 2012
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts
    hi, thanks for this. it works perfectly. i know i'm probably just doing stupid things, but i think im following my book correctly but this next thing doesn't work now. i want to add another variable into the web address.

    so i've made a dropdown list so the user can select something, then i just want it to make that value a variable named "pos". so i've done.

    function position(){
    var pos = getElementById('position').value;
    }

    <form id="position">
    <select id="position" onclick="position()">
    <option></option>
    <option value="1">Position 1</option>
    <option value="2">Position 2</option>
    </select>
    </form>

    im not sure if that's working, because i then run the other function (which updates the iframe) with my new variable included and it returns an error. the other function is the same.

    function iFrameWrite(){
    var month = getMonth();
    var day = getDay();
    var year=new Date();
    var address = "http://www.example.com/" + pos + day + "_" + month + "_" + year.getFullYear() + ".html";
    document.getElementById(id).src = address;
    }


    ??? am i a million miles away? thanks in advance!! :s

  • #4
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,398
    Thanks
    12
    Thanked 570 Times in 563 Posts
    Nope, you aren't

    1. With the "var" keyword you are defining "pos" as a local variable to the function position(). Just omit the "var" and it will be global. You need it to be global in order to access it later from iFrameWrite()

    2. You should use onchange="..." instead of onclick="..." for <select> elements

    3. It's document.getElementById() and not only getElementById()

  • #5
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,981
    Thanks
    56
    Thanked 557 Times in 554 Posts
    I would also question the wisdom of having a function named "position" as well as using "position" for your form and select id's.

    well, firstly, two elements with the same id is illegal html and bound to get you in trouble at some point.

    and from what I recall, having a function and an element id with the same name makes IE wet its pants.

    javascript is case sensitive, remember, so you can even get away with this if you're completely out of ideas:

    Code:
    function posiTion(){
    var pos = document.getElementById('positiOn').value;
    }
    
    <form id="poSition">
    <select id="positiOn" onclick="posiTion()">
    although I prefer to make things more understandable:
    Code:
    function getPosition(){
    var pos = document.getElementById('selpos').value;
    }
    
    <form id="posform">
    <select id="selpos" onclick="getPosition()">
    although really your getPosition function doesn't do a whole lot - you could just as easily do

    Code:
    function iFrameWrite(){
    var pos = document.getElementById('selpos').value;
    var month = getMonth();
    var day = getDay();
    var year=new Date();
    var address = "http://www.example.com/" + pos + day + "_" + month + "_" + year.getFullYear() + ".html";
    document.getElementById(id).src = address;
    }
    meaning you can scrap the getPosition function altogether and keep "pos" as a local variable


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •