Question

How do I convert Jquery that I am using in the Script Editor into its own Webpart?

<script src="https://code.jquery.com/jquery-1.7.2.min.js" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(
        function () {
            // has to be on an interval for grouped doc libraries
            // where the actual links are loaded only once a group
            // is expanded
            setInterval(
                function () {
                    $("a[onclick*=’return DispEx’][target!=’_blank’]")
                        .attr("target", "_blank")
                        .removeAttr("onclick");

                    // document type icons
                    $("td.ms-vb-icon>img[onclick]:not([documentUrl])")
                        .click(function (e) {
                            window.open($(this).attr("documentUrl"), "_blank");
                            e.stopPropagation();
                            e.preventDefault();
                            return false;
                        })
                        .each(function () {
                            $(this).attr(
                                "documentUrl",
                                $.trim(String($(this).attr("onclick"))
                                    .split("=")[1]
                                    .replace(/["'{}]/g, "")
                                    .split(";")[0])
                                );
                            this.onclick = null;
                        });
                    },
                    500
            );
        }
    );
</script>
Was it helpful?

Solution

Save the code in a separate HTML file in your environment then When you add a content editor webpart to a page, you can set the content URL to the location of the HTML file.

To re-use the existing content editor web part to accomplish this:

  1. Download the MSContentEditor.dwp file from the site collection's web part repository (/sites/[site]/_catalogs/wp/.
  2. Edit the file on you computer using a text editor.
  3. Give it a new name in the Title node.
  4. Set the ContentLink node to the URL of your script.
  5. Save the file with the new name of your web part
  6. Upload the web part definition to your web part repository
  7. Add the web part to the page

Here is an example of a full web part definition:

<?xml version="1.0" encoding="utf-8"?>
<WebPart xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://schemas.microsoft.com/WebPart/v2">
  <Title>Testing</Title>
  <FrameType>None</FrameType>
  <Description>Funciton page script</Description>
  <IsIncluded>true</IsIncluded>
  <ZoneID>TopColumnZone</ZoneID>
  <PartOrder>0</PartOrder>
  <FrameState>Normal</FrameState>
  <Height />
  <Width />
  <AllowRemove>true</AllowRemove>
  <AllowZoneChange>true</AllowZoneChange>
  <AllowMinimize>true</AllowMinimize>
  <AllowConnect>true</AllowConnect>
  <AllowEdit>true</AllowEdit>
  <AllowHide>true</AllowHide>
  <IsVisible>false</IsVisible>
  <DetailLink />
  <HelpLink />
  <HelpMode>Modeless</HelpMode>
  <Dir>Default</Dir>
  <PartImageSmall />
  <MissingAssembly>Cannot import this Web Part.</MissingAssembly>
  <PartImageLarge>/_layouts/15/images/mscontl.gif</PartImageLarge>
  <IsIncludedFilter />
  <Assembly>Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c</Assembly>
  <TypeName>Microsoft.SharePoint.WebPartPages.ContentEditorWebPart</TypeName>
  <ContentLink xmlns="http://schemas.microsoft.com/WebPart/v2/ContentEditor">https://[example].sharepoint.com/sites/SiteAssets/Scripts/test.html</ContentLink>
  <Content xmlns="http://schemas.microsoft.com/WebPart/v2/ContentEditor" />
  <PartStorage xmlns="http://schemas.microsoft.com/WebPart/v2/ContentEditor" />
</WebPart>

OTHER TIPS

Yes it is possible to pass URL to HTML file. Use content editor webpart for this. enter image description here

Licensed under: CC-BY-SA with attribution
Not affiliated with sharepoint.stackexchange
scroll top