Code:
<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>
Code:
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:
//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
Edit:
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
Bookmarks