Javascript: Sort listbox on image click

Physt

I'm trying to sort the contents of a select box when you click a button. The problem is that I don't want to use a standard button but an image.

Using input type="image" submits the form which I don't want. When I use an image tag, the onclick won't fire.

Surely, there has to be a way to make an image fire a javascript function. Can anyone help?

Thanks.

You can test the code below using http://www.squarefree.com/htmledit/

<html>
<head>
<title>Sort Select</title>
<script type="text/javascript">

function sortSelect(mySelect) {
var textArray=new Array()
var valueArray=new Array()

for (i=0;i<mySelect.options.length;i++) {
textArray[i] = mySelect.options[i].text;
valueArray[i] = mySelect.options[i].value;
}

textArray.sort()
valueArray.sort()

for (i=0;i<textArray.length;i++) {
mySelect.options[i].text = textArray[i];
mySelect.options[i].value = valueArray[i];
}

}
</script>
</head>

<body>

<form name="testForm">
<select name="list1" size="5" class="test">
<option value="Value1">Option 1</option>
<option value="Value4">Option 4</option>
<option value="Value2">Option 2</option>
<option value="Value3">Option 3</option>
<option value="Value5">Option 5</option>
</select>

<br/>

<image value="addService" onClick="sortSelect(list1);"/> 
<input type="button" onClick="sortSelect(list1);"> 
<input type="image" onClick="sortSelect(list1);"> 

</form>
</body>
</html>

Physt

<a href="javascript:alert('hiya');void(0);"><img border=0 src="C:\Inetpub\wwwroot\images\but_submit.gif"></a>

Wrapped the image in a A tag and voided the href return.

Perturbatio

<form>
<input type="image" src="button.gif" onclick="return false;" />
</form>