JQuery ASP.NET显示一个单击行的图像

时间:2017-04-18 13:27:20

标签: javascript c# jquery asp.net

当我点击该行时,我想在对话框中显示图像,但只是在我点击相关图像的情况下显示图像。 例如: 当我点击第一个图像时,它会显示但是当我点击rowGrid的另一个点时不会发生这种情况。

HTML:

<asp:GridView ID="GridVisualizzaEsercizio" runat="server" AutoGenerateColumns="false" CssClass="mGridNoAlign" 
                            PagerStyle-CssClass="pgr" AlternatingRowStyle-CssClass="alt" OnRowDataBound="GridVisualizzaEsercizio_RowDataBound"
                            OnRowCreated="GridVisualizzaEsercizio_RowCreated" OnSelectedIndexChanged="GridVisualizzaEsercizio_SelectedIndexChanged"
                            OnRowCommand="GridVisualizzaEsercizio_RowCommand" HeaderStyle-BackColor="#507CD1" >
                            <Columns>
                                <asp:TemplateField ItemStyle-CssClass="">
                                    <ItemTemplate>
                                        <div class="hidden-lg hidden-md hidden-sm">
                                            <asp:ImageButton ID="lnkSelect" src="../Images/arrow-right_Smartphone.png" CssClass="img-responsive" runat="server" Text="Visualizza"></asp:ImageButton>
                                        </div>
                                    </ItemTemplate>
                                </asp:TemplateField>                                
                                <asp:BoundField DataField="Giorno" HeaderStyle-CssClass="center" ItemStyle-CssClass="Giorno" ItemStyle-HorizontalAlign="center" Visible="true" HeaderText="Giorno" ReadOnly="true" />

                                <asp:BoundField DataField="Gruppo" HeaderStyle-CssClass="center" ItemStyle-CssClass="Gruppo" ItemStyle-HorizontalAlign="center" Visible="true" HeaderText="Gruppo" ReadOnly="true" />
                                <asp:BoundField DataField="NomeEsercizio" HeaderStyle-CssClass="center" ItemStyle-CssClass="NomeEsercizio" ItemStyle-HorizontalAlign="center" Visible="true" HeaderText="Esercizio" ReadOnly="true" />
                                <asp:BoundField DataField="Serie" HeaderStyle-CssClass="center" ItemStyle-HorizontalAlign="center" Visible="true" HeaderText="Serie" ReadOnly="true" />
                                <asp:BoundField DataField="Ripetizioni" HeaderStyle-CssClass="center" ItemStyle-HorizontalAlign="center" Visible="true" HeaderText="Ripetizioni" ReadOnly="true" />
                                <asp:BoundField DataField="Peso" HeaderStyle-CssClass="center" ItemStyle-HorizontalAlign="center" Visible="true" HeaderText="Peso" ReadOnly="true" />
                                <asp:BoundField DataField="Recupero" HeaderStyle-CssClass="center" ItemStyle-HorizontalAlign="center" Visible="true" HeaderText="Recupero" ReadOnly="true" />

                                <asp:TemplateField HeaderText="Immagine" HeaderStyle-CssClass="center" ItemStyle-HorizontalAlign="center" ItemStyle-CssClass="hidden-sm hidden-xs">
                                    <ItemTemplate>
                                        <div class="img-responsive hidden-xs">                                        
                                        <asp:Image ID="img" CssClass="PathImmagine" runat="server" src='<%#Eval("PathImmagine")%>' Width="208px"/>
                                            <%--<img src='<%#Eval("PathImmagine")%>' onclick="DisplayImage(this)" Width="208" />--%>
                                            <%--<button id="btnGif"  runat="server">GIF</button>  --%>

                                        </div>                                                                          
                                    </ItemTemplate>                                   
                                </asp:TemplateField>                                                                                                
                             </Columns>                           
                        </asp:GridView>
                        <div id="dialog" style="display: none">
                            Giorno:<span id="giorno"></span><br />
                            Gruppo:<span id="gruppo"></span><br />
                            Esercizio:<span id="esercizio"></span><br />
                            Immagine:<span id="pathimmagine"></span>
                        </div>

jquery的:

<script type="text/javascript">
            $("[id*=GridVisualizzaEsercizio]").live("click", function () {
                debugger;

            $("#giorno").html($(".Giorno", $(this).closest("tr")).html());
            $("#gruppo").html($(".Gruppo", $(this).closest("tr")).html());
            $("#esercizio").html($(".NomeEsercizio", $(this).closest("tr")).html());
            $("#pathimmagine").html($(".PathImmagine", $(this).closest("tr")).html('src', 'PathImmagine'));

            $("#dialog").dialog({
                title: "Scheda Allenamento",
                buttons: {
                    Ok: function () {
                        $(this).dialog('close');
                    }
                }
            });
            return false;
        });
    </script>

0 个答案:

没有答案