Disable the postback of asp.net button

Question

My idea is when the user isn't loged in he won't be able to add an item to the shopping cart, so what I did is like so:

<asp:Button ID="BTNAddToCart" runat="server" Text="Add to cart" class="btn btn-info btn-lg" style="display: inline; margin: auto; display: block; visibility: hidden;"  OnClick="BTNAddToCart_Click" />

And then on code behind:

if (Session["User"] == null)
{
    BTNAddToCart.Attributes["class"] = "btn btn-info btn-lg disabled";
    BTNAddToCart.Attributes.Add("title", "Error");  
    BTNAddToCart.Attributes.Add("data-toggle", "popover");
    BTNAddToCart.Attributes.Add("data-trigger", "hover");
    BTNAddToCart.Attributes.Add("data-placement", "bottom");
    BTNAddToCart.Attributes.Add("data-content", "You must be loged in to add items to the cart");  
}

As You can see, by using Bootstrap I gave the button the look which he can't be clicked, but in reality He is still clickable.

So I thought that mabey if I will disable the button postback it will really be not clickable.

How can I disable the button postback?

I have tried:

<asp:Button ID="BTNAddToCart" runat="server" Text="Add to cart" class="btn btn-info btn-lg" style="display: inline; margin: auto; display: block; visibility: hidden;" OnClientClick="BTNJavaScriptClick()" OnClick="BTNAddToCart_Click" />



<script>  

function BTNJavaScriptClick()
{
    var ButtonAdd = document.getElementById("BTNAddToCart");
    if (ButtonAdd.className == "btn btn-info btn-lg disabled") 
        return false;
}

 </script>

I even tried BTNAddToCart.Enabled = false; and it worked but it made my popover disapper.

Community · Accepted Answer · 2017-05-23 10:28:56Z

3

You can simple set Enable asp.net attribute to false and the button will not post back.

BTNAddToCart.Enabled = false;

When an element is disabled you can use the disabled style on css to give him the desired look. Here is a simple example:

input:disabled {
    background: #444;
}

relative to that: Styling a disabled input with css only

edited May 23, 2017 at 10:28

CommunityBot

11 silver badge

answered Jul 3, 2016 at 10:24

Aristos

66.7k16 gold badges117 silver badges154 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

harel486 Over a year ago

One more thing, by doing that it cancelled the "style" I gave the button (The popover) how can I make both oh them work?

Aristos Over a year ago

@harel486 see the style with the :disabled on css w3schools.com/cssref/sel_disabled.asp and please vote and accept the answer if works for you

harel486 Over a year ago

The thing is after puting the BTNAddToCart.Enabled = false; I can't change class via code behind...

Aristos Over a year ago

@harel486 Yes you can, but because is disabled is follow some other set on the css. Just let the class as it is to see what is happens - bootstrap have take care of the disabled elements

harel486 Over a year ago

Can you show me how by writing a bit of the css code? I want the popover to work if the BTNAddToCart.Enabled = true;

|

Martin Parenteau · Accepted Answer · 2016-07-03 15:13:57Z

1

If you want the button to react when the mouse is over it (e.g. show a tooltip) while not triggering a postback when clicked, you can:

Keep the button enabled
Show the button as disabled with the BootStrap style
Prevent the postback by returning false in OnClientClick
Prevent the button from getting the focus

The code would look like this:

if (Session["User"] == null)
{
    BTNAddToCart.CssClass = "btn btn-info btn-lg disabled";
    BTNAddToCart.OnClientClick = "return false;";
    BTNAddToCart.Attributes.Add("onfocus", "this.blur();");
    ...
}

edited Jul 3, 2016 at 15:13

answered Jul 3, 2016 at 15:04

Martin Parenteau

74k13 gold badges137 silver badges158 bronze badges

1 Comment

harel486 Over a year ago

I actually love you! I have been sitting on this for hours!

Collectives™ on Stack Overflow

Disable the postback of asp.net button

2 Answers 2

6 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related