Add remove class using jquery

We can use jquery to add and remove class to html elements using jquery addClass and removeClass methods.

<style>
    .myClass {
    color:blue;
    }
    .primary {
    color:black;
    }
</style>

<input type="button" value="Add Remove class" onclick="AddRemoveClass()"/>
<div id="myDiv" class="myClass">
    This is a div
</div>

<script type="text/javascript">
    function AddRemoveClass() {
        $("#myDiv").removeClass("myClass");
        $("#myDiv").addClass("primary");

        //One liner
        $("#myDiv").removeClass("myClass").addClass("primary");

    }
</script>


Comments

Post a Comment

Popular posts from this blog

Using Progress Bar In C#

Image
Using Progress Bar in C#: Progress Bar is very commonly used control in many applications to display the progress of task being performed. Progress Bar is displayed when copying files, deleting files or installing some software. How to use Progress Bar: ·          Start New Windows Form Application. ·          Go to Toolbox. ·          Select Progress Bar and Drag it to your Form. To make Progress Bar working you need to know some properties of Progress Bar Progress Bar.Maximum: Defines how long it should run Progress Bar.Step: Defines how much it should increase current position of Progress Bar. Progress Bar.Style: How should it look like? There is also a very basic method which is used to run Progress Bar properly. Progress Bar.PerformStep() Let’s see an example. In this example we will copy files and folders from one location to another and show the progress bar wh...
Read more

Check if ViewBag is null or doesn't exist

ASP.NET MVC uses  ViewBag to store some data from Controller and than accessed in View like you can save UserName in ViewBag who is logged in to your website and than display it in view. Sometimes you need to check if ViewBag exists or it is not null than execute your next piece of code. Let's take an example. Controller Code public ActionResult Index() { ViewBag . UserName = "John"; return View(); } View Code @if ( ViewBag . UserName ! = null ) { < label >@ViewBag.UserName</ label >;     } Here if ViewBag.UserName is not null than label will be rendered with username. If it is null the code will not execute. So you can easily check for a ViewBag Property and execute your code.
Read more

Jquery serer side datatables in asp.net

In this post we will learn how we can implement jquery   server side datatables in asp.net mvc application. We need to add datatables library to our page, we can add references of libray from datatables <a href="https://datatables.net/" target="_blank">website</a>. We need to create an html table on which we will apply datatable. <table class="table table-striped table-bordered table-hover table-checkable order-column dataTable" id="tblInventoryItems">   <thead>     <tr>       <th>Item Name</th>       <th>Item Price</th>       <th>Item Quantity</th>       <th></th>     </tr>   </thead>   <tbody></tbody> </table> Then we need the code which will apply the datatable to above html table. Below is the code to apply datatable $("yourtableid").DataTable({         "p...
Read more