使用Javascript获取动态创建的文本框的值时返回错误的值

Question

I've dynamically added some rows to my ASP.NET table using JavaScript, my rows contain textboxes (which are in fact spans), it is my textbox HTML which as added to my table:

               var spanCount = document.createElement("span");
           spanCount.innerHTML = "<input style=\"width:30px\" type=\"text\" name=\"count\" value=1>";

later I change default value of this textbox (default value is 1), and I want to get current value of this dynamically created textbox using JavaScript, I use following code to get its value, but I always get 1 (default value), I want to have current value of this textbox:

alert(document.getElementById('<%=tblFoodList.ClientID %>').rows[1].cells[3].firstChild.innerHTML);

but I get following HTML (I can parse its value):

<input style="width:30px" name="count" value="1" type="text"

as you can see, value="1", but I have changed value, is there any way that I can get current value (or HTML) of this span?

Answer 1

You should use .value instead of .innerHTML to get the text value of an input.

Assuming your structure:

alert(document.getElementById('<%=tblFoodList.ClientID%>') // this is your table
  .rows[1] // second row
  .cells[3] // third column
  .firstChild // the span you created
  .firstChild // the input
  .value // the value of the input
);