在按鈕單擊時使用jQuery從gridview的下拉列表中選擇項目

Question

我有在其中添加了下拉列表和按鈕的gridview。在Rowdatabound事件中，我正在填充下拉列表在按鈕上單擊我想在同一行的客戶端的下拉列表中檢查選中的項目，我如何做到這一點。在腳本上添加腳本以確認消息，如下所示：

<script type="text/javascript">
        function confirmpo() {
            if (confirm("Genrate order for this product?")) {
                return true;
            }
            else {
                return false;
            }
        }

    </script>

<asp:GridView ID="grdColorname" runat="server" onrowcommand="grdvendorname_RowCommand" >

<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<Columns>
<asp:BoundField DataField="ProductId" HeaderText="Company Id" Visible="false"/>
<asp:BoundField DataField="Productname" HeaderText="Product name" />
 <asp:TemplateField HeaderText="Actions" >
                 <ItemTemplate>
                 <asp:DropDownList ID="lstvendor" runat="server">
                 <asp:ListItem Text="Select" Value="-1"></asp:ListItem>
                 </asp:DropDownList>
                 </ItemTemplate>
                 </asp:TemplateField>
     <asp:TemplateField HeaderText="Actions">
                 <ItemTemplate>
                  <asp:Button ID="btnGenratepo" CommandArgument='<%# DataBinder.Eval(Container, "RowIndex") %>' CssClass="btnclassedit" runat="server" CommandName="GenratePO" Text="" ToolTip="Genrate P/O" OnClientClick="javascript:return confirmpo();"/>
 </ItemTemplate>
             </asp:TemplateField
</Columns>
<RowStyle CssClass="RowStyle" />

    <EmptyDataRowStyle CssClass="EmptyRowStyle" />

    <PagerStyle CssClass="PagerStyle" />

    <SelectedRowStyle CssClass="SelectedRowStyle" />

    <HeaderStyle CssClass="HeaderStyle" />

    <EditRowStyle CssClass="EditRowStyle" />

    <AlternatingRowStyle CssClass="AltRowStyle" /> 
</asp:GridView>

關於如何執行此操作的任何建議。

Answer 1

如果我正確理解，那么在confirmpo()內部，您是否想在按鈕的同一行上看到<select>的值？

在這種情況下，首先需要查看頁面的渲染HTML。 gridview將呈現為表格。 您可以使用傳遞給confirmpo()的事件，如下所示：

function confirmpo(e) {
    var btn = e.srcElement;
    // .. locate the <select> element
    // .. insert rest of the code
}

您可能應該通過parentNode屬性直到<tr> ，然后進入<select> 。 使用DOM遍歷庫（例如jQuery） ，可以輕松完成所有這些操作。

Answer 2

看起來像這樣未經測試

$("#grdColorname input:button").click(function(){
 var selectedValue=$(this).parent('td').prev('td').find('input:select').value();
});

selectedValue將包含您的下拉列表所需的值。