+1-888-365-2779
Try Now
More in this section

Forums / Developing with Sitefinity / Disable scripts while in edit mode

Disable scripts while in edit mode

3 posts, 0 answered
  1. Dennis
    Dennis avatar
    16 posts
    Registered:
    10 Aug 2012
    15 Dec 2011
    Link to this post
    HI, I know this has already been covered several times but I can not get any of the suggestions to work so have to open a new thread.

    Problem: I have a jQuery based script (Background Stretcher) that still displays in SF page edit mode and prevents me from editing page content (the stretched image covers all the page content so I can click on a control to edit it).

    Attempts to resolve issue: I have tried various suggested ways to disable JS scripts while in edit mode (http://www.lifeathighroad.com/web-development/quick-tips/quick-tip-disabling-inline-javascript-with-sitefinity-edit-mode/  http://www.sitefinitywatch.com/blog/10-01-28/Prevent_code_from_running_in_Edit_or_Preview_mode.aspx etc)  but most of them assume knowledge of how to program and where to place the code. I am not a programmer so don't know what code I should put in the master page, ascx control or C# file. Everything I have tried over the last two days has failed.

    The instructions in the post http://www.sitefinity.com/devnet/forums/sitefinity-3-x/developing-with-sitefinity/disabling-jquery-on-page-edit.aspx was very helpful and I could follow but when I paste the following code into the ascx it still doesn't disable the background stretcher:

    <telerik:JsFileLink ID="jQuery" runat="server" ScriptType="jQuery" />
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
                Telerik.Cms.Web.CmsPageBase cmsPage = this.Page as Telerik.Cms.Web.CmsPageBase;
                if (cmsPage.PageMode == Telerik.Cms.Web.CmsPageMode.Edit)
                {
                    this.jQuery.Enabled = false;
                }
        }
    </script> 

    Can someone please tell me what I can add to the ascx, C# or even how to modify the js to disable the code?

    Thank you!

    The other code in the ascx control and relevant to the background stretcher is:

    <script type="text/javascript" src="/js/bgstretcher.js"></script>
    <link rel="stylesheet" href="/js/bgstretcher.css" />

    <script type="text/javascript">    
    $(document).ready(function(){
    //  Initialize Backgound Stretcher
    $(document).bgStretcher({
       images: ['/images/background/admin_bg.jpg'], slideShowSpeed: 'slow', nextSlideDelay: 12500, resizeAnimate: true
    });
    });
    </script>

    NOTE: The above js which links to the image is page specific so I also need to be able to place that in each content page so prefer not to include it in a control or master page.  

      
  2. Svetoslav Petsov
    Svetoslav Petsov avatar
    456 posts
    Registered:
    24 Sep 2012
    19 Dec 2011
    Link to this post
    Hi Dennis,

     Are you sure the jquery code is not disabled when you add the server code that you specified? Maybe you are referencing jquery library somewhere else, as well - you should do it only with the JsFileLink control, so that it can be disabled. Also, this disables the jquery code, but not all the javascript code and as far as I can see you have other javascript references in your page and they are probably not disabled by the code. Can you try if the jquery code really is disabled by calling a random jquery function and debugging to see whether it will be called in the javascript? If jquery turns to be disabled, you will also have to disable your other javascript code by performing some checks in the client code itself (as one person has stated in the forum thread that you provided).

    Kind regards,
    Svetoslav Petsov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Dennis
    Dennis avatar
    16 posts
    Registered:
    10 Aug 2012
    20 Dec 2011
    Link to this post
    Hi Svetoslav, Thanks for your reply.

    The jquery code is enabled even when the code hacks are included. It is not being referenced elsewhere. I don't know how to add a "
    random jquery function" but if I manually remove the jquery link then it is completely disabled, the background stretcher doesn't appear and I can edit the page.  I have re-experimented and added this code in my user control (which is manually linked from the master page) but the background stretcher still appears in edit mode. The full code below shows what I have done:

    <%@ Control Language="C#" ClassName="WebUserControl1" %>
    <%@ Register Assembly="Telerik.Cms.Web.UI" Namespace="Telerik.Cms.Web.UI" TagPrefix="sf" %>
        <sf:JsFileLink id="jsLink" runat="server" ScriptType="jQuery" />
        <sf:JsFileLink ID="bgStretcher" runat="server" FileName="~/js/bgstretcher.js" />
        <sf:CssFileLink ID="CssFileLink" runat="server" FileName="~/js/bgstretcher.css" /> 
     <script type="text/C#">
    protected void Page_Load(object sender, EventArgs e) 
            { 
                Telerik.Cms.Web.CmsPageBase cmsPage = this.Page as Telerik.Cms.Web.CmsPageBase; 
                if (cmsPage.PageMode == Telerik.Cms.Web.CmsPageMode.Edit) 
                { 
                    List<Control> csslist = FindControlRecursiveSet("CssFileLink"); 
                    foreach (Control c in csslist) 
                    { 
                        c.Visible = false; 
                    } 
                    List<Control> jslist = FindControlRecursiveSet("JsFileLink"); 
                    foreach (Control c in csslist) 
                    { 
                        c.Visible = false; 
                    } 
                } 
            } 
    </script>

    <script type="text/javascript">    
    $(document).ready(function(){
    //  Initialize Backgound Stretcher
    $(document).bgStretcher({
       images: ['/images/background/admin_bg.jpg'], slideShowSpeed: 'slow', nextSlideDelay: 12500, resizeAnimate: true
    });
    });
    </script>

    I found an error in my first post  as when I paste the following code into the control the background stretcher doesn't work at all (edit, preview or live mode):

    ...
    <telerik:JsFileLink ID="jQuery" runat="server" ScriptType="jQuery" />
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
                Telerik.Cms.Web.CmsPageBase cmsPage = this.Page as Telerik.Cms.Web.CmsPageBase;
                if (cmsPage.PageMode == Telerik.Cms.Web.CmsPageMode.Edit)
                {
                    this.jQuery.Enabled = false;
                }
        }
    </script> 
    ...

    The development site is http://sitefinity.leisuretours.co.nz and I have enabled the background stretcher to show how it works. It would be nice if I could just edit the page in SF and still have the stretcher :(

Register for webinar
3 posts, 0 answered