Jump to content

Radio Button - .innerhtml *answered*

danman97

By danman97
in JavaScript

Recommended Posts

danman97 Newbie

danman97

Posted
Posted

Hi I'm trying to build a Link Generator (just for practice) and am trying to add the option to specify whether it is underlined (using style attribute). However, it no longer works at all. Can someone help? Link: http://dl.dropbox.co...Untitled-3.html Relevant Code: 

<head><script>/*Functions*/function editLink(){var lText= document.getElementById('linkText');var lURL= document.getElementById('linkURL');var lUL= lUL_value();var taValue= document.getElementById('taHTMLoutput');function lUL_value(){var a=document.form1.uLine;if ('a==yes'){return "style=\"text-decoration:underline;\"";}else{return "style=\"text-decoration:none;\"";};}function changeHTML(){return "<a href=\"" + lURL.value + "\" " + lUL.value + ">" + lText.value + "</a>";};taValue.value= changeHTML();document.getElementById('outputP').innerHTML = "<a href=\"" + lURL.value + "\" " + lUL + ">" + lText.value + "</a>";}function select_content(elementID) {  // first set focus  document.getElementById([elementID]).focus();  // select all contents  document.getElementById([elementID]).select();  }function writepageTitle(){// not workingvar pgTitle= document.getElementById('title');document.getElementById('footerpageTitle').innerHTML = pgTitle.innerHTML;}/*Other*/window.onload = 'writepageTitle';// ^^ not working ^^ //</script></head> <body><div id="uberContainer"><header>...</header><div id="mainContainer"><table align="center"><tr><td><form id="form1" onsubmit="return false;" style="border:1; border:#666"><legend><h3>Link Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr><br /><tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" autocomplete="on" size="40" /></td></tr><tr><td><label for="uLine">Underline</label></td><td><input id="uLine_yes" type="radio" name="uLine" value="yes" /> Yes <input id="uLine_no" type="radio" name="uLine" value="no" /> No<br /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><form id="formHTMLoutput"><textarea onClick="select_content('taHTMLoutput');" value="" id="taHTMLoutput"readonly placeholder="The HTML code for the Link will appear here!"></textarea></form></td></tr></table></td></tr></table></div><footer>...</footer></div></body></html>

Full Code: 

<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title id="title">Element Express.: Link Maker!</title><style>/* element styling *//*				 */a{color:#F28705;text-decoration:none;}a:visited{color:#BF3604;}body{font:Tahoma, Geneva, sans-serif;font-family:Tahoma, Geneva, sans-serif;background-color:#324452;color:#cccccc;}textarea{max-width:600px;min-width:350px;min-height:100px;}table{vertical-align:text-top;}hr{ }input{vertical-align:text-top;}/* element id styling *//*					*/div#uberContainer{max-width:75%;margin-left:auto;margin-right:auto;left:50%;outline:solid;outline-color:#97BDBF;min-height:100%;}nav#mainNav{vertical-align:top;right: 10%;}/* classes *//*		 */.inputRight{margin-left:auto;left:100%;}.class1{color:#97BDBF;}</style><script>/*Functions*/function editLink(){var lText= document.getElementById('linkText');var lURL= document.getElementById('linkURL');var lUL= lUL_value();var taValue= document.getElementById('taHTMLoutput');function lUL_value(){var a=document.form1.uLine;if ('a==yes'){return "style=\"text-decoration:underline;\"";}else{return "style=\"text-decoration:none;\"";};}function changeHTML(){return "<a href=\"" + lURL.value + "\" " + lUL.value + ">" + lText.value + "</a>";};taValue.value= changeHTML();document.getElementById('outputP').innerHTML = "<a href=\"" + lURL.value + "\" " + lUL + ">" + lText.value + "</a>";}function select_content(elementID) {  // first set focus  document.getElementById([elementID]).focus();  // select all contents  document.getElementById([elementID]).select();  }function writepageTitle(){// not workingvar pgTitle= document.getElementById('title');document.getElementById('footerpageTitle').innerHTML = pgTitle.innerHTML;}/*Other*/window.onload = 'writepageTitle';// ^^ not working ^^ //</script></head> <body><div id="uberContainer"><header><table id="table_deleteID" width="100%"><tbody><tr><td><h1>Welcome!</h1></td><td width="50%" align="right"><nav id="mainNav"><a href="">Home</a> | <div id="elementsnavContainer"><a onmouseover="">Show stuff on mouse over!</a><br><div id="elementsnavDropdown">Hey</div></div></nav></td></tr></tbody></table><div id="mydiv2" style="cursor:crosshair"></div><hr class="class1" /></header><div id="mainContainer"><table align="center"><tr><td><form id="form1" onsubmit="return false;" style="border:1; border:#666"><legend><h3>Link Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr><br /><tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" autocomplete="on" size="40" /></td></tr><tr><td><label for="uLine">Underline</label></td><td><input id="uLine_yes" type="radio" name="uLine" value="yes" /> Yes <input id="uLine_no" type="radio" name="uLine" value="no" /> No<br /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><form id="formHTMLoutput"><textarea onClick="select_content('taHTMLoutput');" value="" id="taHTMLoutput"readonly placeholder="The HTML code for the Link will appear here!"></textarea></form></td></tr></table></td></tr></table></div><footer><hr><table width="100%"><tbody><tr><td align="center" width="33%"><a href="http://www.meljones.info/">Mel Jones Photography Ltd.</a></td><td align="center" width="34%">© Daniel Carl 2011</td><td align="center" width="33%"><p id="footerpageTitle"></p></td></tr></tbody></table></footer></div></body></html>

Link to comment
Share on other sites
Ingolme w3schools Guru

Ingolme

Posted
Posted

It's lots of code to look through, but I see this mistake:

window.onload = 'writepageTitle';

The onload requires a function, not a string. Try this:

window.onload = writepageTitle;
Link to comment
Share on other sites
Ingolme w3schools Guru

Ingolme

Posted
Posted

Another thing I notice is that you're trying to get the value property of a string: Instead ot this:

return "<a href=\"" + lURL.value + "\" " + lUL.value + ">" + lText.value + "</a>";

Use this:

return "<a href=\"" + lURL.value + "\" " + lUL + ">" + lText.value + "</a>";

Link to comment
Share on other sites
Ingolme w3schools Guru

Ingolme

Posted
Posted

Look, this line is putting a string into lUL

var lUL= lUL_value();

If you look at the function it's running, you'll see that it returns a string, so you don't need the .value property. This is also a problem

var a=document.form1.uLine;

This is an old and unreliable way to access elements. Use document.getElementById() instead.

Link to comment
Share on other sites
thescientist w3schools Guru

thescientist

Posted
Posted

are you checking for errors at all? It would save us a lot of time picking out the little things, so that we can focus either on specific errors, or if it's just logic related, you can add some logging and you can help us track down where the script is failing. I get an error immediately when running clicking the button, and it is the exact line Ingolme just pointed out.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...