Log in

View Full Version : Javascript Question?


orlandojobz
09-19-2008, 05:14 AM
I have this webpage that uses <input type='text' id='userInput'
and a Iframe, with the user input I want them to change the the 'URL' thats inside the iframe, the default Iframe link looks like this

<script type="text/javascript">
function changeIFRAMETONEWURL(){

<!--- the code here??
}
</script>


<input type='text' id='userInput' value="http://www.w3schools.com/TAGS/tag_iframe.asp"/>


<input type='button' onclick='changeIFRAMETONEWURL()' value='Change Url'/>


I tried at runtime this piece of code.

<input type='text' id='userInput' value="http://www.w3schools.com/TAGS/tag_iframe.asp"/>

the Iframe would not display the url located in <input type='text' id='userInput' 'Textbox'
<iframe
src ='userInput' <!---- this does not work -->
width="100%">
</iframe>

and I tried 'still nothing?
<iframe
src ="userInput.value" <!--- does not work also -->
width="100%">
</iframe>

using the javascript how can I change the iframe using the Userinput -URL they
enter.
Thank You Ben:)
Moshambi
09-19-2008, 05:29 AM
FOREWARNING: I HAVE NOT TESTED THIS!
I am basing this all on logic, so I am sorry if this does not work. However, I think it will help you get the right idea or maybe even a new way to think of it. Hope it helps:


<script language="javascript">
function changeIFRAMETONEWURL(elem, elem2)
{
var string = document.getElementById(elem);
var frame = document.getElementById(elem2);

frame.src = string.value;

}
</script>

<iframe
src ='userInput' id="frm"
width="100%">
</iframe>

<input type='text' id='userInput' value="http://www.w3schools.com/TAGS/tag_iframe.asp"/>
<input type='button' onclick='javascript:changeIFRAMETONEWURL(userInput, frm);' value='Change Url'/>
codeexploiter
09-19-2008, 06:08 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled Document</title>
<style type="text/css">

</style>
<script type="text/javascript">
window.onload = function(){
document.forms['f1'].elements['load'].onclick = function(){
changeIfrSrc(document.forms['f1'].elements['url'].value,"ifr");
}
}
function changeIfrSrc(url,ifr){
if(url.indexOf('http://') == -1){
url = 'http://' + url;
}
document.getElementById(ifr).src = url;
}
</script>
</head>
<body>
<form name="f1">
<label>Url</label>
<input type="text" name="url" value="http://www.w3schools.com/TAGS/tag_iframe.asp"/>
<br/>
<input type="button" value="Load" name="load"/>
</form><br/>
<iframe id="ifr" frameborder="0" width="900" height="300" src=""></iframe>
</body>
</html>
orlandojobz
09-20-2008, 05:42 AM
:)
Thank You Moshambi I like to keep your Idea.
Thanks codeexploiter It worked!
"codeexploiter"
I have a question?
Can I make the Iframe Appear visible before the user input.
I' am sure I need to do something to the iframe property, but I need to play around with
that, or do a google on the iframe visibility.
Thanks again.
:)
codeexploiter
09-22-2008, 03:42 AM
Can I make the Iframe Appear visible before the user input.

Yes you can do that. Moreover you can have a default page in your iframe. So nothing else specified this default site will be loaded.

But before using iframe you should understand that the iframe's has its own issues. Sometimes it will act different in different browsers especially if you try to maintain the iframe dynamically.