multiple calendars when clicked twice

[mthor]

I have a calendar popping up it works great except for the fact if you click the calendar and it pops up and happen to click the calendar again another calendar comes up and so on. what am I doing wrong, and how can I get it to where if accidentally clicking the calendar twice that when click once the cal appears and click again and it hides.

thanks for the help

function showCal(id,dateField) {

var dp = new Ext.DatePicker({ renderTo:id, format:"m/d/y", idField:dateField });

//get the element
var el = document.getElementById(dateField);
if(el.value != "")
{
selectedDate = new Date(el.value);
dp.setValue(selectedDate);
}
dp.addListener("select", onSelect);
}

function onSelect(datePicker,date)
{
var dt = new Date(date);
document.getElementById(datePicker.idField).value = dt.format("m/d/Y");
datePicker.destroy();
}

<td class="inputdata">
		<input type="text" name="duedate" id="start"/>
		<img src="images/calendar.png" alt="" onclick="showCal('date1-cal','start');"></img>
		<div id="date1-cal" style="position:absolute;"></div>
	  </td>

[LeeU]

You could try something like this.