Reference JavaScript from View in MVC Widget in Separate Assembly
I followed the tutorial here: 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?
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"
)]
@Html.Script(Url.EmbeddedResource("FullTypeNameOfAClassInTheProject", "MyFirstMvcWidget.Mvc.Scripts.MessageWidget.MessageWidget.js"), "bottom")
And what about stylesheets? Specifically the MIME type inside of AssemblyInfo.cs... Thanks!
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.
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.
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
)
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.