This code will restrict html multi select input to given number. document.addEventListener( “click”, function( event ) { if ( event.target.matches( ‘.input-checkbox’ ) ) { var inputCheckboxes = document.querySelectorAll( ‘.input-checkbox[type=”checkbox”]:checked’ ); if( inputCheckboxes.length > 3 ) { event.preventDefault(); alert( ‘You cannot select more than 3 categories for a post.’ ); } } } );
Tag: Javascript
Why click event not working on SVG
I created a simple menu with SVG icons and to my surprise, clicking on the icon was not taking me to the linked url. It turned out that as SVGs are independent HTML objects, the target element is actually nested path. So, it does not match with the clicked element and thus click event listeners…
Add event listener on SVG element
I was facing problem while adding event listener to an svg element. Then I added event listeners to both svg and path tags, and it worked.
Decode a PHP encoded string url in Javascript
Sometimes you may face a problem when you have to decode a string with Javascript which was originally url encoded with PHP. This can be an API response or cookie set by PHP setcookie function. A simple way to do this is through decodeURIComponent function in Javascript. But it leaves the "+" signs in the string….
Make Javascript sequential with “async” and “await”
Javascript code can be easily made sequential with the help of two simple, yet very powerful keywords “async” and “await”.