html generator question

[kfriend]

Disclaimer: I'm completely new at this, so humor me :o

I need a form to generate code that will link to a url that the user specifies. The process would be:

1. User enters url that they wish to link to
2. User chooses icon
3. Code is generated in which the icon they have chosen links to the url they have entered.

I put together a little example page here (http://www.oddpodz.com/iconExample.html). It's just the form and doesn't actually function, but it might give a better idea of what I need.

Thanks!

[boogyman]

<form name="autoParse" onsubmit="void(0)">
<fieldset>
<legend>Link and Icon Generator</legend>

<label for="url">
<span>URL: </span>
<input type="text" name="url" value="">
</label>
<lablel for="title">
<span>URL Title:</span>
<input type="text name="title" value="">
</label>
<label for="icon">
<span>Choose Your Icon</span>
<input type="radio" name="icon" value="none" selected="selected"> No Icon
<input type="radio" name="icon value="http://www.domain.com/images/icon1.gif"> <img src="http://www.domain.com/images/icon1.gif" width="10" height="10" alt="Icon Title">
<input type="radio" name="icon value="http://www.domain.com/images/icon2.gif"> <img src="http://www.domain.com/images/icon2.gif" width="10" height="10" alt="Icon Title">
</label>

<input type="button" name="submit" value="Create Link" onclick="javascript:createLink(autoParse, linkResult); return false">

<label for="linkResult">
<span>Copy and Paste Code</span>
<textarea name="linkResult" id="linkResult" cols="10" rows="5"></textarea>
</label>
</fieldset>
</form>




function createLink(var frm = '', var placeResult = '')
{
frm = document.frm;
if( isNull(frm.url.value) || (frm.url.value == '') || '/[(http://)(www\.)]/'.test(frm.url.value) === false )
{
alert("The Link you specified is not valid");
frm.url.style="background: #ffff00";
frm.url.focus();
}
if( isNull(frm.title.value) || (frm.utitle.value == '')
{
alert("Must specify a title for the link");
frm.title.style="background: #ffff00";
frm.title.focus();
}


frm.icon.value = (frm.icon.value != 'none') ? frm.icon.value : false;


//EDIT changed the method by which the result is added.
if( frm.icon.value === false )
{
document.getElementById(placeResult).innerHTML = '<a href="'+frm.url.value+'">'+frm.title.value+'</a>';
}
else
{
document.getElementById(placeResult).innerHTML = '<a href="'+frm.url.value+'"><img src="'+frm.icon.value+'" alt="'+frm.title.value+'"></a>';
}

}


autoParse = name of the form you assign to the form
linkResult = id of textarea box you assign to the results



The innerHTML property is blotchy in some circumstances. Using the DOM Method to appendChild would probably result in better use of this, however I am still learning the DOM method, and as such I have decided to use the innerHTML was to parse the response.

I am sure that once someone more knowledgable than myself comes and reads this will show you how to use the DOM Method at which time you can decide which to use. however for now here is my solution... Good Luck