Problem when adding rows to table on the fly

[dougconran]

I have a web page application that requires me to add rows to a table on the fly (it is a fairly standard one to many application).

I don't have a problem controlling the adding of the table rows but one of the cells is a date field and I want to (a) make it readonly and (b) use a date picker.

The syntax works quite happily when the table is created as part of the document creation but neither the readonly nor the ability to click on the image are working when I try and add a row using Javascript.

This is the code I've got:

var thisCell = row.insertCell(6);
thisCell.setAttribute('id','cl'+lastRow);

var el = document.createElement('input');
el.setAttribute('type', 'text');
el.setAttribute('name', 'due' + lastRow);
el.setAttribute('size', '9');
el.setAttribute('readonly','true');
thisCell.appendChild(el);

var el = document.createElement('img');
el.setAttribute('src','/js/calendar/calendaricon.gif');
el.setAttribute('valign','middle');
el.setAttribute('onClick','popUpCalendar(this, document.all.due'+lastRow+',"dd-mmm-yy",-230,-210)');
thisCell.appendChild(el);

It may be something to do with passing parameters using setAttribute - can anyone help?

An alternative way of achieving the same end result would be to use innerHTML but, as I would need to do it on a per row basis and the innerHTML statement (as far as I'm aware) has to be tied to the cell by use of the cell id (which is incremented for each row) I do not know how to code it.

It would have to look something like:

id1.innerHTML = ...
id2.innerHTML = ...

but I don't know how to iterate the index. Is there some sort of eval statement?

TIA

Doug

 

[chessbot]

1. Try

el.setAttribute("readonly","[red]readonly[/red]");

2. Presumably you are using IE which does not evaluate an onclick if passed as a setAttribute. Create a new function called, say IEClick():

function IEClick()
{
  var currelem = document.activeElement;
  popUpCalendar(currelem, document.all.due'+lastRow+', "dd-mmm-yy", -230, -210);
}

and then use

el.attachEvent("onclick",IEClick);

instead of

el.setAttribute('onClick','popUpCalendar(this, document.all.due'+lastRow+',"dd-mmm-yy",-230,-210)');

--Chessbot

There is a level of Hell reserved for probability theorists in which every monkey that types on a typewriter produces a Shakesperean sonnet.

 

[BillyRayPreachersSon]

With IE, unless you are 100% sure of the case of the attribute you are trying to set, I would ALWAYS add an extra parameter to the setAttribute method - ", 0". For example:

setAttribute('readonly', 'true');

would become:

setAttribute('readonly', 'true', 0);

Hope this helps,
Dan