Select button with one click and only open with two clicks

Asked

Viewed 293 times

6

I have a webform Imagebutton that represents directories on a grid using Peater. How to make with 1 click just select the button, and only open with two clicks?

 <asp:Repeater ID="rtInlineBlock" runat="server">
                        <ItemTemplate>
                            <div class="block">
                                <asp:HiddenField ID="idDirectorio" runat="server" Value='<%# Eval("guid") %>' />
                                <asp:ImageButton ID="btSend" runat="server" ImageUrl='<%# Eval("imgPath") %>' OnClick="btSend_Click" />

                                <div class="bottom">
                                    <asp:Label ID="lblNome" runat="server" Text='<%# Eval("xInfo") %>' />
                                </div>
                            </div>
                        </ItemTemplate>
                    </asp:Repeater>

Codebehind:

 protected void btSend_Click(object sender, ImageClickEventArgs e)
    {
        var btSend = sender as ImageButton;
        var rtItem = btSend.Parent as RepeaterItem;
        var idDiretorioSelecionado = rtItem.FindControl("idDirectorio") as HiddenField;

        //faz algo

        }

I just want you to enter this example with double click.

That way it already calls the event by clicking 1 time, wanted to click 1 time just select and I can treat it, and with two open the event.

asp.net webforms

  • you can show your Behind code?

  • I just updated...

  • Any solution? with js?

  • I’m not an expert on Webforms, so I need to run some tests first. But at first glance, if you are using jQuery, you can use the dblclick event().

  • here already has the bootstrap with jquery, however I do not know how to use this function, if I can post the answer the solution would be better

1 answer

0

One solution is to use jQuery’s dblclick event.

Example:

ASPX

<asp:Repeater ID="rtInlineBlock" runat="server">
    <ItemTemplate>
        <div class="block">
            <asp:HiddenField ID="idDirectorio" runat="server" Value='<%# Eval("guid") %>' />
            <asp:ImageButton ID="btSend" ClientIDMode="Static" runat="server" ImageUrl='<%# Eval("imgPath") %>' OnClientClick="return false;" />


            <div class="bottom">
                <asp:Label ID="lblNome" runat="server" Text='<%# Eval("xInfo") %>' />
            </div>
        </div>
    </ItemTemplate>
</asp:Repeater>
<script type="text/javascript">
    $(function () {
        $("#btSend").dblclick(function () {
            $.ajax({
                type: 'POST',
                url: '<%= ResolveUrl("~/Default.aspx/SendClick")%>',
                contentType: 'application/json; charset=utf-8',
                dataType: 'json'
            });
        });
    });
</script>

Note the addition of the Clientidmode="Static" attribute to the Imagebutton. It is necessary for us to select the element via jQuery with $("#btSend"). In addition, you need to remove the original Onclick event and include the Onclientclick="Return false;" property to prevent Postback from occurring on the page by clicking the button.

Code Behind:

[WebMethod]
public static void SendClick()
{
    //faz algo
}

We are making use of a Webmethod to be called via AJAX on the client. Note that the method needs to be static and decorated with the [Webmethod] attribute. In my example the function is as void, but you can return any type, including complex types. The framework is in charge of serialization for JSON.

Note: For a call to a Webmethod to work in a Webforms application, you need to change the following setting in the file ~/App_start/Routeconfig.Cs:

Of: 

settings.AutoRedirectMode = RedirectMode.Permanent;

To:

settings.AutoRedirectMode = RedirectMode.Off;

Without this, the AJAX request receives a return 401 (unauthorized).

I hope I helped you.

Browser other questions tagged asp.net webforms

You are not signed in. Login or sign up in order to post.