none
jQuery function in Page Layout SharePoint 2013 RRS feed

  • Question

  • I created a master page and page layouts using design manager in share point 2013,now I've a requirement to use a jquery function in a page layout so i just tried to check a jquery function to show alert message it's not working.

                                                 

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

            $(document).ready(function() {

     alert('hello');

    });
                    </script>

    but it's not displaying alert message.i tried to do the same thing in the content editor webpart on the page and it worked.

    so can anyone let me know how to call jquery fuctions in the page layout for sharepoint 013

    Tuesday, April 22, 2014 1:04 PM

Answers

  • Hello,

    Where are you using jquery in the page layout,make sure it must be placed just above the Publishing:EditModePanel tag which is generated by the design manager like below

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

    jQuery(document).ready(function()
    {       
    alert('hello');

    });

     </script>
          
          
            <!--MS:<Publishing:EditModePanel runat="server" id="editmodestyles">-->
                    <!--MS:<SharePoint:CssRegistration name="&#60;% $SPUrl:~sitecollection/Style Library/~language/Themable/Core Styles/editmode15.css %&#62;" After="&#60;% $SPUrl:~sitecollection/Style Library/~language/Themable/Core Styles/pagelayouts15.css %&#62;" runat="server">-->
                    <!--ME:</SharePoint:CssRegistration>-->
                <!--ME:</Publishing:EditModePanel>-->
                <!--CE: End Edit Mode Panel Snippet-->
            <!--ME:</asp:ContentPlaceHolder>-->

    also i noticed you've used $(document).ready(function() ,replace it with  jQuery(document).ready(function()

    if it helps please mark it as answer.

    Tuesday, April 22, 2014 1:32 PM

All replies

  • Hello,

    Where are you using jquery in the page layout,make sure it must be placed just above the Publishing:EditModePanel tag which is generated by the design manager like below

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

    jQuery(document).ready(function()
    {       
    alert('hello');

    });

     </script>
          
          
            <!--MS:<Publishing:EditModePanel runat="server" id="editmodestyles">-->
                    <!--MS:<SharePoint:CssRegistration name="&#60;% $SPUrl:~sitecollection/Style Library/~language/Themable/Core Styles/editmode15.css %&#62;" After="&#60;% $SPUrl:~sitecollection/Style Library/~language/Themable/Core Styles/pagelayouts15.css %&#62;" runat="server">-->
                    <!--ME:</SharePoint:CssRegistration>-->
                <!--ME:</Publishing:EditModePanel>-->
                <!--CE: End Edit Mode Panel Snippet-->
            <!--ME:</asp:ContentPlaceHolder>-->

    also i noticed you've used $(document).ready(function() ,replace it with  jQuery(document).ready(function()

    if it helps please mark it as answer.

    Tuesday, April 22, 2014 1:32 PM
  • It worked.Thanks
    Tuesday, April 22, 2014 1:53 PM