How to use $ as well as jQuery

Question

I have an opencart project in which I used $('#some-id') as well as jQuery('#some-id') , which worked fine, but after upgrading the project from 1.5 to 2.1 its only host is jQuery('#some-id') and throwing error for $('#some-id') as

TypeError: $ (...) null

The following is my one of a hundred sample ajax functions.

  $('#button-coupon').on('click', function() { $.ajax({ url: 'index.php?route=total/coupon/coupon', type: 'post', /*Here $ is not working jQuery works. Not just here, but in each line where $ is used its throwing error, untill & unless I replace it with jQuery.*/ data: 'coupon=' + encodeURIComponent($('input[name=\'coupon\']').val()), dataType: 'json', success: function(json) { $('.alert').remove(); } }); }); 

Is there a way to make both work. I do not want to waste time replacing $ with jQuery ?

Below is a snapshot of the error in the firebug console.

If I change $('input[name=\'coupon\']') to jQuery('input[name=\'coupon\']') than to another line where $ is used. for example, see image below.

I tried using the latest as well as older versions of jQuery, but my problem still persists.

Answer 1

Since you did not provide any information about your code, this is just a general hint, but it is probably worth diving into you:

What is usually done when trying to prevent conflicts between different JS infrastructures and libraries (all with the $ shortcut) is to encapsulate your own library or modules in this way:

 jQuery.noConflict(); (function($) { // your library or modules here })(jQuery); 

Thus, the jQuery identifier should be specified only once, outside of your own code, when this definition is self-consistent right away. Inside this block, the jQuery library is now known under the $ label again, but it no longer encounters other customs of this label outside this block of code.

This is a compilation of allusions to this topic: https://api.jquery.com/jquery.noconflict/