How to use javascript variable in iframe src

Question

how to write javascript variable in iframe src?

Like

<iframe id="showskill" scrolling="yes" height="350" width ="350" src="http://localhost/POSkill/skillshow.aspx?user_id="+ ReturnURL() ></iframe>

Here ReturnURL() is a javascript function which returns a value. But the problem is in the iframe source I'm not getting the returned value of the function. Am I not putting in the right format or missing something?

Thanks in advance Johnny

First step: Load up your html, right click, and select 'view source' then go down and find where the iframe tag exists. Check the 'src=' attribute, and please respond with what it says. If it has no value (or an incorrect value) for 'user_id=', it is likely an issue with your function, otherwise we will have to figure out another way to pass parameters. — BananaNeil
– BananaNeil, Commented Dec 27, 2011 at 8:29

nnnnnn · Accepted Answer · 2011-12-27 08:25:28Z

23

You can't use JavaScript variables or functions directly within your html markup in that manner. What you can do is define your iframe first and then set its source from JavaScript:

<iframe id="showskill" scrolling="yes" height="350" width ="350" src=""></iframe>

<script>
    document.getElementById("showskill").src =
              "http://localhost/POSkill/skillshow.aspx?user_id="+ ReturnURL();
</script>

There are several other ways to achieve something similar, but I don't really want to go through them all when I'm not sure quite what your context is.

answered Dec 27, 2011 at 8:25

nnnnnn

150k30 gold badges210 silver badges247 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Umesh Patil · Accepted Answer · 2011-12-27 08:24:50Z

4

You can not append the variable returned by function direcly as you did here. Do, something as given below.

var url=ReturnURL();
var urlPath='http://localhost/POSkill/skillshow.aspx?user_id='+url;
document.write('<iframe id="showskill" scrolling="yes" height="350" width ="350" src="'+urlPath+'><\/iframe>');

answered Dec 27, 2011 at 8:24

Umesh Patil

10.7k16 gold badges56 silver badges81 bronze badges

4 Comments

Peter-Paul van Gemerden Over a year ago

This is incorrect. Appending the return value of a function is perfectly possible. Try this: var ohai = "O" + 'HAI'.toLowerCase(); (jsfiddle here)

nnnnnn Over a year ago

@PPvG - you can't append the return value directly in html markup as shown in the question. I'm sure that's what Umesh meant, though the code sample in this answer then made that a bit ambiguous.

Peter-Paul van Gemerden Over a year ago

@nnnnnn I think you might be right. If so: sorry for misunderstanding.

Umesh Patil Over a year ago

@PPvF, In your JS fiddle, it is perfectly accepted that variable can be appended to String returned by Function. but, speaking about iframe, where you want to display on HTML, we can not add the variable in the HTML tag. You need to render the iFrame with dynamic variable returned by function. I have used similar script many times before :)

Collectives™ on Stack Overflow

How to use javascript variable in iframe src

2 Answers 2

Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related