0

グリッドビューのテンプレート フィールドに画像ボタンがあります。プラスボタンがクリックされた行の下に別のグリッドビューを開きたいのですが、私の問題は、内側のグリッドビューが親グリッドビューの列として開き、選択した行の下に開かないことです。さまざまな設計方法を試しましたが、まだうまくいきません。画像ボタンのクリックで子グリッドビューを開くために Jquery を使用しています。以下は、Jquery のグリッドとコードの設計です。

<div class="gridContentholder">
    <asp:GridView ID="grdsamplestock" runat="server" AlternatingRowStyle-CssClass="alt"
                AutoGenerateColumns="False" CssClass="styleGrid" GridLines="None" OnSelectedIndexChanged="grdsamplestock_SelectedIndexChanged"
                OnRowDataBound="grdsamplestock_RowDataBound" OnRowCreated="grdsamplestock_RowCreated">
          <AlternatingRowStyle CssClass="alt" />
          <Columns>
               <asp:TemplateField>
                   <ItemTemplate>
                     <asp:HiddenField ID="hdnSampleStockMasterID" runat="server" Value='<%#Eval("SampleStockMasterID") %>' />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:BoundField HeaderText="DoctorName" DataField="DoctorName" />
                    <asp:BoundField HeaderText="Comments" DataField="Comments" />
                    <asp:BoundField HeaderText="TotalSampleStockQuantity" DataField="TotalSampleStockQuantity" />
                    <asp:BoundField HeaderText="SampleDate" DataField="SampleDate" SortExpression="SampleDate"
                        DataFormatString="{0:dd/MM/yyyy}" HtmlEncode="false" NullDisplayText="N/A" />
                    <asp:TemplateField>
                       <ItemTemplate>
                            <a href="javascript:expandcollapse('div<%# Eval("SampleStockMasterID") %>', 'one');">
                                <img id="imgdiv<%# Eval("SampleStockMasterID") %>" alt="Click to show/hide Orders for Customer <%# Eval("SampleStockMasterID") %>"
                                    width="9px" border="0" src="../Images/plus.gif" />
                            </a>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <%--<asp:Panel ID="pnlInnerGrid" runat="server" >--%>
                            <tr style="display: none;" id="div<%# Eval("SampleStockMasterID") %>">
                                <td colspan="5">

                                    <asp:GridView ID="grdItems" CssClass="styleGrid" PagerStyle-CssClass="pgr" runat="server"
                                        AutoGenerateColumns="false" GridLines="None" OnRowCreated="grdItems_RowCreated"
                                        AlternatingRowStyle-CssClass="alt" >
                                        <AlternatingRowStyle CssClass="alt"></AlternatingRowStyle>
                                        <Columns>
                                            <asp:BoundField HeaderText="Reference No" DataField="ReferenceNo" />
                                            <asp:BoundField DataField="ProductName" HeaderText="Product" SortExpression="ProductName" />
                                            <asp:BoundField DataField="Specification" HeaderText="Specification" SortExpression="Specification" />
                                            <%--  <asp:BoundField DataField="StoreKeeparID" HeaderText="StoreKeeparID" SortExpression="StoreKeeparID" />--%>
                                            <%--<asp:BoundField DataField="Name" HeaderText="StoreKeeper Name" SortExpression="Name" />--%>
                                            <asp:BoundField DataField="WarehouseName" HeaderText="Warehouse" SortExpression="WarehouseNmae" />
                                            <asp:BoundField HeaderText="Expiry Date" DataField="ExpiryDate" DataFormatString="{0:d}"
                                                HtmlEncode="false" />
                                            <asp:BoundField HeaderText="Lot No" DataField="LotNo" />
                                            <asp:TemplateField>
                                                <ItemTemplate>
                                                    <asp:HiddenField ID="SampleStockTrsID" runat="server" Value='<%# Eval("SampleStockTrsID") %>' />
                                                </ItemTemplate>
                                            </asp:TemplateField>
                                        </Columns>
                                    </asp:GridView>

                                </td>
                            </tr>
                            <%--   </asp:Panel>--%>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
   </div>

//Jquery のコード。

<script language="javascript" type="text/javascript">
    $(document).ready(function () {
        //            var=$('div[id^="player_"]')

    });
    function expandcollapse(obj, row) {
        var div = document.getElementById(obj);
        var img = document.getElementById('img' + obj);
        if (div.style.display == "none") {
            div.style.display = "";
            $(div).hide().show(1000);
            if (row == 'alt') {
                img.src = "../Images/minus.gif";
            }
            else {
                img.src = "../Images/minus.gif";
            }
            img.alt = "Close to view other Sample Transaction";
        }
        else {
            $(div).hide(1000, function () {
                div.style.display = "none";
            });
            if (row == 'alt') {
                img.src = "../Images/plus.gif";
            }
            else {
                img.src = "../Images/plus.gif";
            }
            img.alt = "Expand to show Available Stock";
        }
    } 
</script>
4

1 に答える 1

0

以前のプロジェクトの 1 つでこれを使用していました。私のプロジェクトからの実行コードサンプルを提供します。必要に応じて変更してください。お気軽にご質問ください。

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" OnRowDataBound="GridView1_RowDataBound">
    <Columns> 
        <asp:TemplateField>
            <ItemStyle BackColor="#C2D88B" Width="250px" />
            <ItemTemplate>
                <div>
                    //Draw your table here by placing a html table
                </div>
                <div>
                    <p>
                        <asp:ListView ID="ListView1" runat="server">
                            <ItemTemplate>
                                <asp:Label ID="Label1" runat="server" Text='<%# Eval("item_id") %>'></asp:Label>
                                <asp:Label ID="Label2" runat="server" Text='<%# Eval("quantity") %>'></asp:Label>
                            </ItemTemplate>
                            <ItemSeparatorTemplate>
                            <br />                                        
                            </ItemSeparatorTemplate>
                        </asp:ListView>
                    </p>
                </div>
            </ItemTemplate>
        </asp:TemplateField>                 
    </Columns>
</asp:GridView>
于 2012-07-02T12:50:46.630 に答える