Adding auto-incrementing badges to icons in Bootstrap 4.0

That facebook icon that tells you how many new messages you have? Useful, huh? You don’t leave the page, and it gets updated. It’s a little trick done with a combination of SQL and asynchronous jQuery.

I needed to implement notifications for a few applications at work, so I’ve found a way to implement this with just a few lines of jQuery and an asynchronous call to the database.

I’ve put this example up on bootsnipp:

https://bootsnipp.com/snippets/PDPN5

Check it out! On bootsnipp, it’s just pulling a number from random.org and refreshing for demo purposes, but the source of the number can be replaced with an SQL count(*) query.

Spread the love

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>