Workaround for failed loading of images

Images that depend on server-side loading fails sometimes due to multiple reasons, like image is not present, location might be wrong, browser fails to load or process the image. All these returns 404 as HTTP status. This breaks the image placeholder too. Using JQuery, the broken image can be replaced with the error placeholder image with this simple JQuery snippet:

Get filename from URL with extension

Get the filename from the URL or path using Javascript:

Consider the URL:

var url = "http://www.example.com/my_page.html"

Method 1:

url.split('/').pop()

Method 2: Regular Expression

url.replace(/^.*[\\\/]/, '')

Both method returns

my_page.html

---

But when URL is something like this with query parameters:

var url = "http://www.example.com/my_page.html?id=123&value=456"

Then above methods will return:

my_page.html?id=123&value=456

In order to remove query parameters from the URL, use:

url.split('/').pop().split('?')[0]

This again returns

​​​​my_page.html

Query parameters reside in next index.

 

 

Quick Fix: Scrolling and Focus when multiple bootstrap modals are open

When more than one modal is opened you might have noticed that after the latter modal loses its focus, the former modal loses its scrolling option, rather page’s body scrolls (if exists, otherwise no scrollbar!). There is a quick fix for this:

Using query string in script tag

It is possible to send query string to an external JavaScript file like this:

< script src="scripts.js?version=123"></script>

Get query string value

Get the value of a field from query string using JavaScript:

function getURLParameter(name) {
    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)
                              (&|#|;|$)').exec(location.search)||[,""])
                              [1].replace(/\+/g, '%20'))||null
}