javaScript Tips · jQuery

Inject jQuery into a Webpage Through Chrome Javascript Console

include these lines of jQuery instantiation code in the javascript console

Exploring the DOM is much easier with jQuery. However, You may be working with a webpage that does not natively have jQuery installed.

That’s ok, the following lines of code will solve this. Just include these lines of jQuery instantiation code before you explore the DOM and now you can use jQuery!

AJAX · javaScript Tips · jQuery · Solution to Error

[SOLVED] How to Fix $.ajax() Not Working ie 8, ie 9 and ie 10

 

jQuery is an great tool to use for making ajax calls. As usual MS Internet Explorer has to make things that would otherwise be standard — difficult. Setting aside any rants about how much hair one can pull out in the days it takes to accomplish something that should have been easy, here is what works.

In order for $.ajax() to work with ie, there are certain things you must make sure are in place.

Internet Explorer, in all its wisdom, insists on caching, so it is important to prevent ie from caching when making a GET call to an API.

This can be done a number of ways shown below.

In the client side jQuery code

To prevent caching universally in your jQuery code use:

On a per call basis, use “cache: false,”  within the $.ajax() object as shown below.

In the $.ajax()  object

Be sure to specify    contentType: ‘application/json; charset=utf-8’,  within the $.ajax() object.
However, the dataType within the $.ajax() object, should remain as dataType: ‘json’,

Important Server Side configurations:

Be sure to set the response headers as follows:
“Access-Control-Allow-Origin”, “*”
“Access-Control-Allow-Headers”, “Origin, X-Requested-With, Content-Type, Accept”
‘Content-Type’, ‘text/plain’  <– this can be a gottcha for ie

Also, there is a workaround for the Cross-Domain AJAX for IE8 and IE9 mess.

If you are working with jQuery, install the script from the following git repo. It’s easy. Just include it and it works!  Be sure to install it after the jQuery script is called. You do not need to configure anything.
https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest

Example  $.AJAX()  OBJECT that works with IE 8 – 11

Frontend · How To · javaScript Tips · jQuery · Web Design

How to Get All the Selected Values from a Multi-Select with jQuery

Need to know how to get all the selected values or text values from a multi select element (drop down)? Its simple with jQuery!

Start by declaring an array. One for the values of the multi select element and one for the text values. Well, if you even need the text values from the multi select, that is.

Now we can use the ‘ :selected’ jQuery selector. That we get all the items from the select element that the user has selected. We can use the jQuery ‘each()’ function to iterate over the select element and gather the values and texts into the arrays using jQuery’s standard ‘.val()’ and ‘.text()’ functions.

Next iterate through the selected items, using the standard val() to return the selected option’s value or text() to grab the actual display text that made up the list item.