DOM insertBefore problem

[boogyman]

javascript


/**
* dynamically add form fields to a form
* you must pass in the id of the template fields and the id of the span where
* the fields will be placed(before) and the name of the counter. You name your
* template fields starting with 0, the dynamic fields are incremented from 1.
*/

var counters = new Array();

function addFormFields(dynamicFormReadId, dynamicFormWriteId, counter, counterStart, url)
{
if(!counters[counter])
counters[counter] = counterStart;

counters[counter]++;

var newFields = document.getElementById(dynamicFormReadId).cloneNode(true);

newFields.id = '';
newFields.style.display = 'block';

var newField = newFields.childNodes;

for (var i=0;i<newField.length;i++)
{
var theName = newField[i].name;

if (theName)
{
newField[i].name = theName.substr(0, theName.length - 1) + counters[counter];
newField[i].value = '';
}

var theId = newField[i].id;

if (theId)
newField[i].id = theName.substr(0, theName.length - 1) + counters[counter];
}

var insertHere = document.getElementById(dynamicFormWriteId);
ln168 insertHere.parentNode.insertBefore(newFields,insertHere);
}



html


<div id="meeting0">
<input type="text" name="m_name0" value="">
<input type="text" name="m_date0" value="">
<input type="text" name="m_hours0" value="" size="5" onchange="updateHours(['tot_m_hours','total_hours'],this.value);return false;"> hours
</div>
<span class="meetingHolder"><!-- USED AS PLACEHOLDER FOR ADDING MEETING HOURS --></span>
<input type="button" class="addButton" onclick="addFormFields('meeting0','meetingHolder','m0',0, ''); return false" value="Add Meeting Hours">



giving me the error

insertHere has no properties line 168

.....
what the script is attempting to perform is clone the "meeting" div id, and insert it above the span meetingHolder tag.
This script is working for another portion of the site, however I cannot figure why it breaks on this template when they are represented the same way.

other template


<div id="dynamicFormReadLang">
<label>Related Doc Id:</label>
<input type="text" name="relatedDoc0" id="langrelatedDoc0" value="{top.RELATED_DOC0}" class="field" />
<a href="/admin/searchDocId.php?relatedDocNum=langrelatedDoc0" target="newWin" onclick="popUpWin(this.href,'console',506,465);return false;">Search for Document Id</a>
<br />
</div>
<span id="dynamicFormWriteLang"><!-- USED AS PLACEHOLDER TO INSERT DYNAMIC FIELDS --></span>
<p class="submit">
<input type="button" value="Add More Related Doc Fields" onclick="addFormFields('dynamicFormReadLang', 'dynamicFormWriteLang', 'c1', {top.RELATED_DOC_COUNT}, '/admin/searchDocId.php?relatedDocNum=langrelatedDoc')" />
</p>

[Twey]

<span class="meetingHolder">
var insertHere = document.getElementById(dynamicFormWriteId);Are we noticing a slight problem here? :)

[boogyman]

shoot me now? haha I cannot believe it was something that stupid.... oh well, 2.5 days of wasted time n effort over 5 characters... Thanks Twey