Accessing TextArea inside GridView using JQuery BlockUI
It drives me crazy!
I am trying to access a TextArea inside a GridView control. The TextArea appears when a button is pressed on the grid screen. For some reason, textarea.value always contains "".
<asp:GridView ID="gvCategories" runat="server" AutoGenerateColumns="false"
onrowcommand="gvCategories_RowCommand">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<input type="button" value="add comment" onclick="showCommentBox()" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<div id="commentBox" style="display:none">
<input type="button" value="move comment input box" onclick="moveComment()" />
<textarea id="txtComment" rows="10" cols="30">
</textarea>
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
function moveComment() {
alert(document.getElementById("txtComment").value);
}
I added this server side code, but the TextBox always returns "
protected void gvCategories_RowCommand(object sender, GridViewCommandEventArgs e)
{
var row = (GridViewRow) (e.CommandSource as LinkButton).NamingContainer;
var description = (row.FindControl("txtDescription") as TextBox).Text;
lblComment.Text = description;
}
a source to share
@Azam - This is related to your other post that I answered. A grid is the generation of a commentBox DIV along with all of its children multiple times with the same set of IDs.
I ran a test on this and found that each call document.getElementById("txtComment")
returns the next matching element in the DOM with that Id until it overlaps the entire collection of matching elements, reverting back to the first, and then that over and over.
This is why you get emptiness when you try to access the value of a textbox or textbox.
You need to change your call to showComment()
so that it retains a reference to the element on the given line, and then when you call moveComment()
it will work on the same element, not just the next element in the DOM with the same ID.
a source to share