Melanie Melanie - 1 month ago 5
ASP.NET (C#) Question

Finding the Current Row Being Edited in an asp:GridView using jQuery

I currently have an asp:GridView that displays a few BoundFields and then one asp:TemplateField that holds an asp:DropDownList. I can add multiple rows to the grid and edit each of them individually.

What I need to find out is how I can get the selected value of the current DropDownList being edited in the current row.

I've tried using the following code in a function that I call on my link button:

var product = $('.selectedItem').val();


But this code only ever returns the value of whichever row is first. So even though I'm editing the DropDown in the 3rd row and selecting the 5th value, if the 1st row's value was 2, it will only ever return two.

My html for the DropDown:

<asp:TemplateField HeaderText="Vendor">
<ItemTemplate>
<asp:HiddenField ID="hidEntityID" runat="server" Value='<%# Eval("SomeID") %>' />
<asp:DropDownList ID="ddlList" runat="server" DataSourceID="dsList" DataTextField="Value" DataValueField="ID" Font-Names="Verdana" Font-Size="11px" ForeColor="#2D2D2D" ClientIDMode="Static" CssClass="selectedItem" OnDataBound="ddlEntity_DataBound">
<asp:ListItem Value="-1">--- Select ---</asp:ListItem>
</asp:DropDownList>
<asp:ObjectDataSource ID="dsList" runat="server" SelectMethod="GetList" TypeName="SomeClass" OldValuesParameterFormatString="original_{0}"></asp:ObjectDataSource>
</ItemTemplate>
</asp:TemplateField>


My link button in the Grid:

<ItemTemplate>
<a href="#" onclick='addEditDetail(<%# Eval("ID") %>)'>Detail</a>
</ItemTemplate>


Basically what I need is to find the current index of the row I'm editing or selecting to 'edit' and then only get the value of that specific DropDown.

Any suggestions would be awesome.

Thanks

Answer

Yes it will always return first dropdown as your selector is requesting the default link button. $('.selectedItem') will return all dropdowns keeping first one as default.

Your link button click event should be:

 <ItemTemplate>
       <a href="#" onclick='addEditDetail(this)'>Detail</a>
 </ItemTemplate>

 function addEditDetail(linkBtn)
{
    var currentDropDown = $(linkBtn).closest("tr").find("select[id*='ddlList']");
    alert(currentDropDown.val());
}
Comments