Caps Lock Alert for Password Input Fields

<input type="password" id="password">
<span id="warning" style="display:none;color:#c00">[Caps Lock]</span>
<script>
document.getElementById("password").addEventListener("keyup", function(event) {
  document.getElementById("warning").style.display = (event.getModifierState("CapsLock")) ? "inline" : "none";
});
</script>
Excel VBA

VBA EXCEL: Mirror Comments to Matching Cells of Another Spreadsheet in the Same Workbook

I have an Excel workbook with 13 protected sheets, January through December plus a Summary that needed the same cell comments for each month.

There were 2 options…

  • Type comments into each sheet manually; then update 11 sheets (Feb-Dec) by hand whenever comments need changing 😬
  • Add VBA code to the workbook that automatically duplicates cell comments from January (unprotected) to February through December (protected) when those sheets are activated 😎
Continue reading

Add Pattern Support for HTML5 Input Type Number with jQuery

Ran into an issue earlier today that I could not figure out and ended up asking my second question on StackOverflow in seven years.

I was trying to use <input type="number" pattern="[0-9]{8}"> to enforce 8-digit numbers while allowing leading zeros. This was being done on an optional field (no required attribute) and I could not understand why it was bypassing my pattern on the populated field (eg: value “1234” was accepted, pattern ignored).

Continue reading

How to Continue Using Buttons with “data-loading-text” in Bootstrap 4 with jQuery

While converting a Bootstrap 3 template design for use with Bootstrap 4, I noticed they removed stateful buttons (eg: “loading” and “reset” button states) from BS4! Granted it was mentioned in BS3, but I never noticed the deprecated warning 🙁

The deprecated code for showing a button’s loading state was $('#selector').button('loading') and to return the button to its original state you would use  $('#selector').button('reset') .

Continue reading

Add Mouse Wheel Support to Bootstrap Carousel with jQuery

I was adding mouse wheel events to a ul element with the CSS rule overflow:hidden to emulate mouse wheel scrolling when no scrollbar was present.

The links in the unordered list also trigger a Bootstrap 4.1 Modal that contains a Bootstrap Carousel. So I decided to add the same functionality to my modal carousel gallery.

Continue reading