Pure MVC / Jquery

Posted by Community Admin on 03-Aug-2018 16:04

Pure MVC / Jquery

All Replies

Posted by Community Admin on 15-Sep-2015 00:00

Including jquery on a Pure MVC layout page breaks backend editing when using the prescribed method:

@Html.Script(ScriptRef.JQuery)

This is due to the followng script error:  

TypeError: jQuery.validator is undefined

Can anyone advise on how this can be done? Has anyone actually used Pure MVC on a real project? 

 

Posted by Community Admin on 15-Sep-2015 00:00

Yeah on multiple projects, haven't had an issue

 Try @Html.Script(ScriptRef.JQuery, "top") ...or whatever all your other widgets views have it set to.

Is it on a specific widget, you on the latest version...?

Posted by Community Admin on 16-Sep-2015 00:00

Thanks for your response.

I'm adding jquery to the template not widget, this all works as expected but its the fact that once I create a page based on the template I'm unable to edit in the backend due to the error mentioned above.

I'm using the trial version of 8.1.5810.0 in order to evaluate Pure MVC with a view to using it on an upcoming project.

Posted by Community Admin on 16-Sep-2015 00:00

This is what I do

 

@if (!Util.IsEditMode)
    @Html.Section("jquery")
    @Html.Script(ScriptRef.JQuery, "jquery")
@Html.Section("bottom")

I then do a find\replace in my project for  @Html.Script(ScriptRef.JQuery, "top") to @Html.Script(ScriptRef.JQuery, "jquery")

 (this is the Util method)

namespace SitefinityWebApp
    public static class Util
    
        public static bool IsEditMode
        
            get
            
                return SystemManager.IsDesignMode;
            
        
    

This puts jQuery right at the bottom of the page, by default it's gonna load at the top.  It's injected in page edit mode, so this loads the once I specify only in Live move where I want. 

 

[quote]Ruth said:

Thanks for your response.

I'm adding jquery to the template not widget, this all works as expected but its the fact that once I create a page based on the template I'm unable to edit in the backend due to the error mentioned above.

I'm using the trial version of 8.1.5810.0 in order to evaluate Pure MVC with a view to using it on an upcoming project.

[/quote]

Posted by Community Admin on 18-Sep-2015 00:00

Hi,

Here's a simplified version of Steve's approach:

@if (!SystemManager.IsDesignMode)
    @Html.Script(ScriptRef.JQuery, "top")

And here's what we use in the default templates:

@* Inline editing scripts and helpers. They should be available only when inline editing is possible. *@
@if (Html.ShouldRenderInlineEditing())
    @Html.Script(ScriptRef.MicrosoftAjax, "top")
    @Html.Script(ScriptRef.MicrosoftAjaxCore, "top")
    @Html.Script(ScriptRef.JQuery, "top")
 
    @Html.Script(Url.EmbeddedResource("Telerik.Sitefinity.Resources.Reference", "Telerik.Sitefinity.Resources.Scripts.jquery.ba-outside-events.min.js"), "top")
    @Html.Script(ScriptRef.KendoAll, "top")
    @Html.Script(Url.EmbeddedResource("Telerik.Sitefinity.Resources.Reference", "Telerik.Sitefinity.Resources.Scripts.RequireJS.require.min.js"), "top")
    @Html.InlineEditingManager(false)

Regards,
Velizar Bishurov
Telerik
 
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 Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
 

Posted by Community Admin on 06-Dec-2017 00:00

Sorry if this has been answered anywhere else but I've been searching for days and am totally lost. Looking for some help if at all possible.

I'm on Sitefinity version 10.1.6502 using pure MVC using a copy of the Bootstrap resource package. This version of Sitefinity comes with a built in JQuery version 1.12.1 which is considerably old now as JQuery is now at version 3.2.1. I'm trying to include the new version of JQuery (3.2.1) but it is conflicting with Sitefinity's version and corrupting the dashboard and of course the runtime. Is there anyone that has had success with including a later version of JQuery other than built in JQuery? Or am I doing something completely wrong? I've done the following steps with no success:
- Make a copy of "ResourcePackages/Bootstrap" folder and rename the copy to "ResourcesPackages/MyProject" (example).

- Created a Layout (default.cshtml) page within "ResourcePackages/MyProject/MVC/Views/Layouts".
- in the default.cshtml page I had included the following reference to JQuery CDN:
<script src="ajax.googleapis.com/.../jquery.min.js" type="text/javascript">
- I then wrapped my JavaScript with the noConflict wrapper.

I can identify that the JQuery version is taking by typing in $.fn.jquery in the browser console but I'm getting the following error which breaks the Sitefinity backend:
-------------------------------
Uncaught TypeError: Cannot read property 'addMethod' of undefined
    at Telerik.Sitefinity.Web.UI.GenericCollectionBinder.initialize (Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=ctl13_TSM&compress=0&_TSM_CombinedScripts_=%3b%3bTelerik.Sitefinity.Resources%3aen%3a8446b584-fa8b-471b-825f-...........................

Any help would be much appreciated!

Posted by Community Admin on 06-Dec-2017 00:00

Hi Blair

You are right. The backend does not work with Jquery 3. What I have done to get around this is in my layout page I put a condition check to load different versions. Version 3 for public pages and 1 for backend editing.

@if (SystemManager.IsDesignMode || SystemManager.IsPreviewMode)                      <script src="code.jquery.com/.../script>                  else                      <script src="code.jquery.com/.../script  

 

The assumption is that when in your page editing mode you don't need Jquery 3 in particular.  (In my case I didn't )

I hope the option helps you.

 

Posted by Community Admin on 07-Dec-2017 00:00

Thank you very much Darrin, that solution is working - using JQuery version 1.12.1 while in dashboard and using 3.2.1 on the live site. I still see the error message "Cannot read property 'addMethod', while in the dashboard but all dashboard functionality seems to be working still. So I don't think its a problem.

 

Thank you again for the solution, it has lowered the stress on this long struggle. :)

Posted by Community Admin on 07-Dec-2017 00:00

I was able to resolve the error message, see my solution:

<body>
    @Html.Section("top")
    @if (!SystemManager.IsDesignMode && !SystemManager.IsPreviewMode)
   
        <script src="code.jquery.com/.../script>
   

    <header>
        @Html.SfPlaceHolder("header")
    </header>
    <main>
        @Html.SfPlaceHolder("content")
    </main>
    <footer>
        @Html.SfPlaceHolder("footer")
    </footer>

    @* Inline editing scripts and helpers. They should be available only when inline editing is possible. *@
    @if (Html.ShouldRenderInlineEditing())
   
        @Html.Script(ScriptRef.MicrosoftAjax, "top")
        @Html.Script(ScriptRef.MicrosoftAjaxCore, "top")

        // This version is required for Sitefinity to dashboard to work properly.
        @Html.Script(ScriptRef.JQuery, "top")

        @Html.Script(Url.EmbeddedResource("Telerik.Sitefinity.Resources.Reference", "Telerik.Sitefinity.Resources.Scripts.jquery.ba-outside-events.min.js"), "top")
        @Html.Script(ScriptRef.KendoAll, "top")
        @Html.Script(ScriptRef.KendoTimezones, "top")
        @Html.Script(Url.EmbeddedResource("Telerik.Sitefinity.Resources.Reference", "Telerik.Sitefinity.Resources.Scripts.RequireJS.require.min.js"), "top")
        @Html.InlineEditingManager(false)
   

Posted by Community Admin on 07-Dec-2017 00:00

Hi Blair

I should have mentioned. I put this in my <head> section  because that is where Sitefinity loads its jquery.

I also remove and disable the "Inline Editing" stuff because it interferes with my scripts sometimes and overall, I prefer people to edit pages in the backend. So will only enable it on request. 

Posted by Community Admin on 07-Dec-2017 00:00

Thanks very much Darrin for the additional info. I've moved this to <head> as well and it is working.

This thread is closed