0

I'm making a CRUD with a GridView, but when i try to edit a row when using an UpdatePanel i have to double click it so it works instead of clicking it just once, but also when i double click it it causes my validators to show and also a postback(which i don't want). like this:

enter image description here

This is the design code of the button:

<asp:TemplateField>
                    <ItemTemplate>
                        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                            <ContentTemplate>
                                <asp:ImageButton ID="btnEdit" CausesValidation="false" CssClass="btnOPTIONS" runat="server" ImageUrl="~/imgBTN/edit.png" Width="30px" Height="30px" ToolTip="Edit" CommandName="Edit" />
                                <asp:ImageButton ID="btnDelete" CausesValidation="false" runat="server" ImageUrl="~/imgBTN/delete.png" Width="30px" Height="30px" ToolTip="Delete" CommandName="Delete" />
                            </ContentTemplate>
                            <Triggers>
                                <asp:PostBackTrigger ControlID="btnDelete" />
                            </Triggers>
                        </asp:UpdatePanel>

                    </ItemTemplate>


                    <EditItemTemplate>
                        <asp:ImageButton ID="btnUpdate" CausesValidation="false" CssClass="btnOPTIONS" runat="server" ImageUrl="~/imgBTN/save.png" Width="30px" Height="30px" ToolTip="Update" CommandName="Update" />
                        <asp:ImageButton ID="btnCancel" CausesValidation="false" runat="server" ImageUrl="~/imgBTN/cancel.png" Width="30px" Height="30px" ToolTip="Cancel" CommandName="Cancel" />
                    </EditItemTemplate>
</asp:TemplateField>

EDIT:My question is looking for a slighlty different answer as i've already tried the answer from How to use update panel on button click asp. i want my button not having to double click so it doesn't do a postback & activates the validators.

Lopez93
  • 35
  • 8
  • 1
    Possible duplicate of [How to use update panel on button click asp](https://stackoverflow.com/questions/22476535/how-to-use-update-panel-on-button-click-asp) – Ricardo Pontual Apr 27 '18 at 10:56
  • check for my edit. – Lopez93 Apr 27 '18 at 11:09
  • Move to asp.net mvc and use javascript – Isma Apr 27 '18 at 11:43
  • 1
    use this code and on javascript fire (when you click), just disable the update panel - https://stackoverflow.com/questions/14769641/how-to-keep-javascripts-after-updatepanel-partial-postback/14769925#14769925 – Aristos Apr 27 '18 at 12:27
  • Maybe you need to use different ValidationGroup. – VDWWD Apr 27 '18 at 14:13
  • there's no need for that, all i needed to do was a "nesting trick" and moving the UpdatePanel to the EditItemTemplate. – Lopez93 Apr 29 '18 at 00:25

1 Answers1

0

I managed to fix this issue by using a "nesting trick" and moving the UpdatePanel to the EditItemTemplate, Now it looks like this and works perfectly:

<asp:UpdatePanel runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
            <ContentTemplate>
                <asp:GridView EmptyDataText="No hay registros en la base de datos!" ID="gvImages" runat="server" DataKeyNames="idcountry" AutoGenerateColumns="false" Height="300px" OnRowEditing="gvImages_RowEditing"
                    OnRowCancelingEdit="gvImages_RowCancelingEdit" OnRowUpdating="gvImages_RowUpdating" OnRowDeleting="gvImages_RowDeleting" AllowPaging="true" OnPreRender="gvImages_PreRender" PageSize="6"
                    OnPageIndexChanging="gvImages_PageIndexChanging">
                    <Columns>
                        <asp:BoundField DataField="idcountry" HeaderText="ID" ReadOnly="true" />

                        <asp:TemplateField HeaderText="Relacion">...</asp:TemplateField>

                        <asp:TemplateField HeaderText="Nombre">...</asp:TemplateField>

                        <asp:TemplateField>...</asp:TemplateField>

                        <asp:TemplateField>
                            <ItemTemplate>2ImageButtons...blah,blah</ItemTemplate>
                            <EditItemTemplate>
                                <asp:UpdatePanel runat="server">
                                    <ContentTemplate>
                                        <asp:ImageButton ID="btnUpdate" CausesValidation="false" CssClass="btnOPTIONS" runat="server" ImageUrl="~/imgBTN/save.png" Width="30px" Height="30px" ToolTip="Update" CommandName="Update" />
                                    </ContentTemplate>
                                    <Triggers>
                                        <asp:PostBackTrigger ControlID="btnUpdate" />
                                    </Triggers>
                                </asp:UpdatePanel>
                                <asp:ImageButton ID="btnCancel" CausesValidation="false" runat="server" ImageUrl="~/imgBTN/cancel.png" Width="30px" Height="30px" ToolTip="Cancel" CommandName="Cancel" />
                            </EditItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>
            </ContentTemplate>
        </asp:UpdatePanel>

Thank you for your patience and good will. :)

Lopez93
  • 35
  • 8