Question

Currently I’m developing a webpart for SharePoint. I’m using JQuery in my webpart. Users will install my webpart and use it in there sharepoint site. I’m new to JQuery. I have couple of confusions in mind.

1) Suppose there are some other webpart which is already installed in SharePoint site. So exactly how I’m going to manage and use JQuery and Jquery UI so that it does not conflicts with other Jquery /JQuery UI plug-in used by other webparts (from other vendor) in the page.

2) Can you explain me exactly how two different versions of JQuery /Jquery UI can work in same page. Im using jQuery v1.5 and JQuery UI v1.8.

Currently I’m including jquery and jquery Ui lib using the code below and everything is working when I write code using $(selector).opetaions().opetaions()….. but I have the above confusions in mind.

public static void IncludeScript(Page page, String key, String location)
        {
            if (!page.ClientScript.IsClientScriptIncludeRegistered(key))
                page.ClientScript.RegisterClientScriptInclude(key, location);
        }

        public static void LoadCSS(Page page, String src)
        {
            HtmlLink css = new HtmlLink();
            css.Href = src;

            css.Attributes["rel"] = "stylesheet";
            css.Attributes["type"] = "text/css";
            css.Attributes["media"] = "all";

            page.Header.Controls.Add(css);
        }

All please guide me by sharing your thoughts.

Thanks.

Answer 1

There are actually several risks here:

1. risk of conflict with other jQuery versions
2. risk to erase a jQuery plugin already installed by another Web Part (or the page itself)
3. risk that another Web Part (or the page itself) erases a jQuery plugin installed by your Web Part

To prevent 3/, you can use noConflict(true) in your own code (note the “true” argument):
http://api.jquery.com/jQuery.noConflict/

To prevent 1/ and 2/, you would need to check if (window.jQuery) is already present on the page before loading your own version.