Skip to main content

Using jQuery with Other Libraries - The noConflict() Method of jQuery

As you are already aware that jQuery uses the $ sign as a shortcut for jQuery.
But what if any other JavaScript frameworks like Prototype, MooTools, Knockout, JavaScript MVC, Google Web Toolkit, Google Closure, or Ext JS also use the $ sign as a shortcut, or what happens if you are using more than one jQuery library on your page.
"In such cases, you have two different frameworks or libraries using the same shortcut, which might result in your scripts stopping working."

So here comes the benefit of the jQuery noConflict() method which releases the hold on the $ shortcut identifier, so that other scripts can use it.
·         This function gives control of the $ variable back to whichever library first implemented it.
·         This helps to make sure that jQuery doesn't conflict with the $ object of other libraries.

Example 1: Use $ as a shortcut for the first library. You'll still be able to use "jQuery" for another library to avoid conflict.

<html>
    <head>
        <script src="prototype.js"></script>
        <script src="jquery.js"></script>
        <script>
            jQuery.noConflict();

            // Use jQuery via jQuery(...)
            jQuery(document).ready(function () {
                jQuery("div").hide();
            });

            // Use Prototype with $(...)
            $('txt').hide();
        </script>
    </head>
</html>

Example 2: Use $ as shortcut for first library. If you want another library with shortcut or any other nice name you want instead of writing jQuery, you can do it with noConflict method as:

<html>
    <head>
        <script src="prototype.js"></script>
        <script src="jquery.js"></script>
        <script>
            var $j = jQuery.noConflict();

            // Use jQuery via $j(...)
            $j(document).ready(function () {
                $j("div").hide();
            });

            // Use Prototype with $(...)
            $('txt').hide();
        </script>
    </head>
</html>

Cheers Friends!!!
Labels:

Comments

Post a Comment

Popular posts from this blog

Difference between Web API, WCF and Web Service

So now we have got the basic idea about Web API , now let’s do some comparison of Web API with WCF and web services. Web Service WCF Web API Web services are created as files with .asmx extension. WCF create with .svc extension Web API are simple class file with .cs(for C#) extension. Web API is inherited from “ApiController” and the class name must end with “Controller”. It is SOAP based service and returns data in XML form. It is also based on SOAP and returns data in XML form. Web API is HTTP based service and by default, it returns data in JSON or XML form. It supports only HTTP protocol. It supports various protocols like TCP, HTTP, HTTPS, Named Pipes, and MSMQ. It supports HTTP protocol. It can be hosted only on IIS. It can be hosted within the application or on IIS or using window service. It can be hosted within the application or on IIS. It is no...
4 comments
Read more

C#: Merging Excel cells with NPOI HSSFWorkbook

In this post we’ll see how to merge the two or more cell with each other while creating the excel sheet using NPOI . Mentioned below is code to merge multiple cells, in this example we are merging first cell to fifth cell of first row (you can adjust row or cell range by passing particular parameters in CellRangeAddress). //Created new Workbook var hwb = new NPOI.HSSF.UserModel. HSSFWorkbook (); //Create worksheet with name. var sheet = hwb.CreateSheet( "new sheet" ); //Create row and cell. var row = sheet.CreateRow(0); var cell = row.CreateCell(0); ; //Set text inside cell cell.SetCellValue( "This is Merged cell" ); cell.CellStyle.WrapText = true ; //define cell range address // parameters: -> first row to last and first cell to last cell var cra = new NPOI.SS.Util. CellRangeAddress (0, 0, 0, 4); //Add merged region to sheet. sheet.AddMergedRegion(cra); Hope this solution helps you J
4 comments
Read more

Use TempData Keep or Peek method to persist data in MVC

TempData used to transfer data between controllers or between actions. There is one point to note that TempData is only work during the current and subsequent request and it is generally used to store one time message. But one can persist data in TempData object even after request completion with the help of Keep() or Peek() method. TempData.Keep(): TempData.Keep() method keep value in TemData object at the end of current request. There are two overloaded keep methods available with TempData: ·          void Keep(): This method make ensures that all the items in TempData are not destroyed on current request completion. ·          void Keep(string key): One can persist the specific item in TempData by passing in the item name. TempData.Peek(string key): It returns an object that contains the element that is associated with the specified key, without marking the key for deletion. Exampl...
5 comments
Read more