How to apply css to a button after on click in repeater

Himanshu Tyagi

I am using a button inside repeater. How to aplly css to clicked button and i click on another button then css should be add on the clicked button and removed from the first clicked button?

5 Replies

Know the answer? Post it — somebody with the same question will find it here.

Ankit Sharma8y ago
Hi,

Since you are adding dynamic CSS , it won't stay after page reloads.
When the page reloads it will take referance from your code file , when you press button the css will be applied for that particular session only . It will be lost if page reloads.

If you want it to be on page load also then you have to put it in your CSS file, so that it will take reference on every load.
Himanshu Tyagi8y ago
Not working Ankit sir!!! its only working when button click but when page gets reload its remove..but i want this after page load.
Ankit Sharma8y ago
Hi,

Please refer to below link to find how to access button inside a repeater using Jquery.

http://www.aspforums.net/Threads/153005/Assign-jQuery-Click-event-handler-to-a-button-inside-ASPNet-Repeater-control/

Apply the same logic for your code and change the css class for buttons
Himanshu Tyagi8y ago

There is two button and my coding is

protected void rptrQtyVariant_ItemCommand(object source, RepeaterCommandEventArgs e)
{
if (e.CommandName == "ItemQty")
{
LinkButton button = e.Item.FindControl("lnkQtyVariant") as LinkButton;
button.CssClass = "product-variant__btn pdp-btn";
if (e.Item.ItemIndex == 0)
{
LinkButton lnk = e.Item.FindControl("lnkQtyVariant") as LinkButton;
lnk.CssClass = "product-variant__btn pdp-btn product-variant__btn--active";
}
else if (e.Item.ItemIndex == 1)
{
LinkButton lnk = e.Item.FindControl("lnkQtyVariant") as LinkButton;
lnk.CssClass = "product-variant__btn pdp-btn product-variant__btn--active";
}
else
{
LinkButton lnk = e.Item.FindControl("lnkQtyVariant") as LinkButton;
lnk.CssClass = "product-variant__btn pdp-btn";
}
}
}

so all i want is when i click on 500 kg then the css should be add with this button and css should be removed from 1 ltr. and then i click on 1ltr button then the css should b add with ltr button nd removed from 500kg button.

These buttons are in repeater so id if every button is same and my button is in repeater is like this :
Ankit Sharma8y ago
Hi,

Create one cssClass with all the desired CSS that you want to add. Then use the below code to add cssClass to one button and remove it from another button using Jquery.
$(document).ready(function () {
          $('#Buttonid').on('click', function (e) {
              e.preventDefault();
              $(this).addClass("className");
              $('#anotherbuttonid').removeClass("className");
          });
      });
Please modify this as per your need.