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

Forums / Project Feather / Reference JavaScript from View in MVC Widget in Separate Assembly

Reference JavaScript from View in MVC Widget in Separate Assembly

7 posts, 1 answered
  1. Mikyle
    Mikyle avatar
    3 posts
    Registered:
    15 Mar 2016
    17 May
    Link to this post

    I followed the tutorial here: http://docs.sitefinity.com/feather-create-widgets

    I created a widget in it's own project. Then to the view, I added a button to call a js function. However, when referencing the .js file, sitefinity is unable to find it.  See view code below:

    @using Telerik.Sitefinity.Mvc;
    @using Telerik.Sitefinity.Frontend;
    @using Telerik.Sitefinity.Frontend.Mvc.Helpers;
    @using Telerik.Sitefinity.Web.UI;
     
    @model MyFirstMvcWidget.Mvc.Models.MessageWidgetModel
     
    <h1>
        @Html.Raw(Model.Message)
    </h1>
     
    <button type="button" onclick="showAlert()">Alert!</button>
     
    @*This script tag does not work*@
    <script src="~/Mvc/Scripts/MessageWidget/MessageWidget.js"></script>
     
    @*This line does not work either*@
    @Html.Script(Url.WidgetContent("/Mvc/Scripts/MessageWidget/MessageWidget.js"), "bottom")

    It seems as though sitefinity is looking for these scripts in

    SitefinityWebApp/Mvc/Scripts/MessageWidget/MessageWidget.js

    Rather than looking in

    MyFirstMvcWidget/Mvc/Scripts/MessageWidget/MessageWidget.js

     

    Am I referencing this script incorrectly?

  2. Velizar Bishurov
    Velizar Bishurov avatar
    143 posts
    Registered:
    23 Sep 2016
    20 May
    Link to this post
    Hello,

    If the script file is in the external assembly as well the only way to reference it is to serve it as embedded resource.

    To do that firstly right click on the script, click Properties and set the Build Action to Embedded Resource. Secondly open the AssemblyInfo.cs file of the project and instruct it that the script is a web resource like so:

    using System.Web.UI;
    [assembly: WebResource("MyFirstMvcWidget.Mvc.Scripts.MessageWidget.MessageWidget.js", "application/x-javascript")]

    Lastly reference it in the markup like so:

    @Html.Script(Url.EmbeddedResource("FullTypeNameOfAClassInTheProject", "MyFirstMvcWidget.Mvc.Scripts.MessageWidget.MessageWidget.js"), "bottom")

    As the first parameter you need to enter the full type name of an existing class in the project in order for the assembly to be resolved. For example you may enter "MyFirstMvcWidget.Mvc.Models.MessageWidgetModel"

    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
     
    Answered
  3. jhawver
    jhawver avatar
    1 posts
    Registered:
    27 May 2016
    15 Jun in reply to Velizar Bishurov
    Link to this post
    And what about stylesheets?  Specifically the MIME type inside of AssemblyInfo.cs...  Thanks!
  4. Mikyle
    Mikyle avatar
    3 posts
    Registered:
    15 Mar 2016
    15 Jun in reply to jhawver
    Link to this post

    For CSS I used the following syntax in my AssemblyInfo.cs

    [assembly: WebResource("SitefinityWebApp.Mvc.Styles.site.css", "text/css", PerformSubstitution = true)]

    I forgot exactly where this is documented, but it works.

  5. Damein
    Damein avatar
    9 posts
    Registered:
    10 Apr 2012
    28 Jun
    Link to this post

    Can someone please explain this better.

    I'm confused because if you look at the feather samples they are no referenced in this way.  They are referenced using this style?

    @Html.Script(Url.WidgetContent("/Mvc/Scripts/MessageWidget/MessageWidget.js"), "bottom")

     

    Also why does this document page not reflect whats being said here.

    http://docs.sitefinity.com/feather-refer-to-resources-inside-views

  6. Victor Leontyev
    Victor Leontyev avatar
    65 posts
    Registered:
    01 Jul 2014
    28 Jun in reply to Damein
    Link to this post

    Hi Damein. 

    Case, expained above by Velizar, is for resource files, located  in another assembly. For example you created separate .dll for your widgets with embedded resources. And you can use some resources (js or css) from this .dll inside another dll. You can do it in this way:

    @Html.Script(Url.EmbeddedResource("FullTypeNameOfAClassInTheProject", "MyFirstMvcWidget.Mvc.Scripts.MessageWidget.MessageWidget.js"), "bottom")

     

    If you want to use your resources located in your assembly, you can follow this article http://docs.sitefinity.com/feather-refer-to-resources-inside-views and use something like that:

    @Html.Script(Url.WidgetContent("Mvc/Scripts/Captcha/captcha.js"), "bottom", false)

  7. Damein
    Damein avatar
    9 posts
    Registered:
    10 Apr 2012
    28 Jun
    Link to this post

    Thanks. Sorry to me it didn't seem obvious if you were meaning using the script within your own assembly or from a another. Then looking at the feather sample they were referenced using the bottom method.

     

7 posts, 1 answered