Background - this code adds & deletes file inputs from the screen as well as adds & deletes them from an array that will be used in the uploading process.
I'm having trouble splicing the correct value from an array. In the remove function, I think it is always removing file1/element 0 from the array rather than the corresponding file that's being deleted from the screen. Can anybody tell what's wrong with the count parameter it's using and how to fix it?
var fileNames = [];
fileNames[0] = "file1";
function addFileTextbox()
{
//main div that the other divs will be added to
var divLocation = document.getElementById('addToDiv');
//create new div for holding textboxes, & give it a unique name for uploading
var newDiv = document.createElement('div');
var count = document.getElementById('addToDiv').getElementsByTagName('input').length + 2; //+2 because since it hasn't been appended yet, the length will be short one. We need this number to set the unique div name.
var divIDName = 'file' + count;
newDiv.innerHTML = '<input type="file" name="' + divIDName + '" size="57"> <a href="#" onclick="removeAdditionalFile(this.parentNode, this.count)">Remove</a>';
//add the divIDName to the array, & store it in the hidden input.
fileNames[count-1] = divIDName; //-1 because the array starts at 0 - so file1 goes in [0], file2 in [1], etc.
document.fileForm.fileArray.value = fileNames.join(); //string - default comma delimiter
//Attach new div to main div location:
divLocation.appendChild(newDiv);
}
function removeAdditionalFile(divIDNode, count)
{
//get main div that the other divs are attached to
var divLocation = document.getElementById('addToDiv');
//delete the file textbox
divLocation.removeChild(divIDNode);
//delete the file from the array, & store back into hidden input
fileNames.splice(count-1, 1); //count-1 is index, 1 is how many to remove
document.fileForm.fileArray.value = fileNames.join();
}