none
jquery plugins with sharepoint 2010 RRS feed

  • Question

  • Hi Guys,

    I get the basic concept of jquery like how to load the jquery module in sharepoint (whether you do it via a masterpage or on each individual page).  What I don't understand is how to actually get a jquery plugin to work on sharepoint.  I went online and found some and when I download them and unzip the plugin there is normally a few folders (css, html folder, etc) and then one or two .js files in there.  I tried putting that folder in a document library and then used a content editor webpage to point to it, but it never does anything.  What am I missing here?  Thank in advance

    Friday, February 27, 2015 4:27 PM

Answers

  • Hi,

    Sidebars.css and sidebars.js are for developing use, sidebars.min.css and sidebars.min.js which has smaller size are for production use.

    You can reference the sidebars plugin in a Content Editor Web Part like this(I put the .js and .css files in the “SideBar” folder of “Shared Documents” library):

    They will be loaded along with other .js and .css files when page loading:

    Best regards


    Patrick Liang
    TechNet Community Support

    Monday, March 2, 2015 9:08 AM
    Moderator
  • Hi,

    You may be trying to call the function before the script file loaded.  You can use the following technique to ensure that your scripts are loaded before getting call.

    (function ($, undefined)

        $("document").ready(function ()
       {

         SP.SOD.executeFunc("<jsfilename>","<<function name>>",function()

           {

                  //your code goes here

            });

        });

    })(jQuery);

    For more information, please refer to the following article.

    http://www.ilovesharepoint.com/2010/08/sharepoint-scripts-on-demand-spsod.html

    Please don't forget to mark it as answered, if your problem resolved or helpful.

    Monday, March 2, 2015 9:33 AM

All replies

  • hi,

    Where have you put the jquery refrence?

    the below url could help you with jquery and sharepoint.

    http://www.codeproject.com/Articles/544538/JQuery-with-SharePoint

    Let me know if this help.

    Thanks

    Bhism

    Friday, February 27, 2015 5:33 PM
  • I've just placed it inside a CEWP so that it loads the module.  My question I guess really is what do you do with the plugins once you download them?  Do you just put the folder in a document library, create a CEWP and point the link to the .js file in the library?
    Friday, February 27, 2015 5:52 PM
  • I tried creating a file called jquery.js and placing this inside it:

    <script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"> </script>
    <script language="javascript" type="text/javascript">

    I then uploaded this file to a document library, created a new content editor web part and pointed the link to the .js file listed above.  But whenever I got o save the page after that I just get an error that pops-up.  So frustrating when I know this is something simple I'm sure.

    Friday, February 27, 2015 6:28 PM
  • hi,

    refer the below articles to achieve what you want

    http://www.codeproject.com/Articles/544538/JQuery-with-SharePoint

    http://fitandfinish.ironworks.com/2010/01/the-best-way-to-add-custom-javascript-and-jquery-to-sharepoint.html


    Whenever you see a reply and if you think is helpful,Vote As Helpful! And whenever you see a reply being an answer to the question of the thread, click Mark As Answer

    Friday, February 27, 2015 7:24 PM
  • I dont want to add it to my entire site, I'm just trying to add it to a page my a content editor web part.  I've found several websites discussing how to do that, but they never work.  It just gives me an error.  Not sure why
    Friday, February 27, 2015 7:34 PM
  • OK So I finally got jquery loaded for my single site, but I'm still confused as to how do I load an actual plugin.  For instance, I just downloaded the slidebar jquery plugin (http://plugins.adchsm.me/slidebars/).  When I download it there are the following files:

    slidebars.css

    slidebars.js

    slidebars.min.css

    slidebars.min.js

    slidebars.jquery.json

    I'm confused now as to what I am supposed to do with these files in order to get them to run on my sharepoint page.  I've tried everything and it never displays anything.  I tried putting them all in a document library in a folder called "slidebar" and then I created a new CEWP and in the link I tried linking it to each one of the files and it never works.  I'm sure this is something extremely simple, but I just dont know what to do with them.

    Friday, February 27, 2015 9:46 PM
  • Hi,

    Sidebars.css and sidebars.js are for developing use, sidebars.min.css and sidebars.min.js which has smaller size are for production use.

    You can reference the sidebars plugin in a Content Editor Web Part like this(I put the .js and .css files in the “SideBar” folder of “Shared Documents” library):

    They will be loaded along with other .js and .css files when page loading:

    Best regards


    Patrick Liang
    TechNet Community Support

    Monday, March 2, 2015 9:08 AM
    Moderator
  • Hi,

    You may be trying to call the function before the script file loaded.  You can use the following technique to ensure that your scripts are loaded before getting call.

    (function ($, undefined)

        $("document").ready(function ()
       {

         SP.SOD.executeFunc("<jsfilename>","<<function name>>",function()

           {

                  //your code goes here

            });

        });

    })(jQuery);

    For more information, please refer to the following article.

    http://www.ilovesharepoint.com/2010/08/sharepoint-scripts-on-demand-spsod.html

    Please don't forget to mark it as answered, if your problem resolved or helpful.

    Monday, March 2, 2015 9:33 AM