Using Umbraco 7.2, when i try to write javascript inline (on the template page) When i view the page it breaks, using chrome dev tools i noticed it is converting all the javascript to lowercase so ".addClass" becomes ".addclass" and doesn't get recognised.
Strangely this only seems to happen in chrome, in firefox and IE it displays correctly.
I know using inline javascript is not best practice for Umbraco, but can anyone tell me why it might be doing this?
@inherits Umbraco.Web.Mvc.UmbracoTemplatePage
@{
Layout = null;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="/css/style.css" />
<script src="js/libs/modernizr-2.0.6.min.js"></script>
</head>
<body>
<header>
<nav class="nav-menu">
<ul class="nav-menu-main">
<li><a href="/" class="nav-home glyphicon glyphicon-home"></a></li>
<li>
<a href="/">one</a><span></span>
<ul class="nav-menu-sub">
@foreach (var item in CurrentPage.Site().adviserZone)
{
var linkUrl = (bool)item.isInternal ? Umbraco.NiceUrl(item.Value<int>("internal")) : item.link;
var linkTarget = (bool)item.newWindow ? "_blank" : null;
<li><a href="@linkUrl" target="@linkTarget">@item.caption</a></li>
}
</ul>
</li>
<li>
<a href="/">two</a><!--<span class="caret"></span>-->
<ul class="nav-menu-sub">
@foreach (var item in CurrentPage.Site().knowledgeCentre)
{
var linkUrl = (bool)item.isInternal ? Umbraco.NiceUrl(item.Value<int>("internal")) : item.link;
var linkTarget = (bool)item.newWindow ? "_blank" : null;
<li><a href="@linkUrl" target="@linkTarget">@item.caption</a></li>
}
</ul>
</li>
<li>
<a href="/partners">three</a><span></span>
<ul class="nav-menu-sub">
@foreach (var item in CurrentPage.Site().partners)
{
var linkUrl = (bool)item.isInternal ? Umbraco.NiceUrl(item.Value<int>("internal")) : item.link;
var linkTarget = (bool)item.newWindow ? "_blank" : null;
<li><a href="@linkUrl" target="@linkTarget">@item.caption</a></li>
}
</ul>
</li>
<li>
<a href="/">four</a><span></span>
<ul class="nav-menu-sub">
@foreach (var item in CurrentPage.Site().products)
{
var linkUrl = (bool)item.isInternal ? Umbraco.NiceUrl(item.Value<int>("internal")) : item.link;
var linkTarget = (bool)item.newWindow ? "_blank" : null;
<li><a href="@linkUrl" target="@linkTarget">@item.caption</a></li>
}
</ul>
</li>
<li>
<a href="/">five</a><span></span>
<ul class="nav-menu-sub">
@foreach (var item in CurrentPage.Site().inTheNews)
{
var linkUrl = (bool)item.isInternal ? Umbraco.NiceUrl(item.Value<int>("internal")) : item.link;
var linkTarget = (bool)item.newWindow ? "_blank" : null;
<li><a href="@linkUrl" target="@linkTarget">@item.caption</a></li>
}
</ul>
</li>
</ul>
</nav>
@{
IPublishedContent current = (CurrentPage);
Stack<dynamic> pages = new Stack<dynamic>();
while (current.Level > 1)
{
pages.Push(current);
current = current.Parent;
}
}
<div class="breadcrumb-bar">
<ul class="breadcrumbs container">
<li><a href="/">Home</a></li>
@foreach (var page in pages)
{
var cls = page.Id == CurrentPage.Id ? "current" : "";
<li class="@cls"><a href="@page.Url">@page.Name.ToLower()</a></li>
}
</ul>
</div>
</header>
<div class="container body-content">
@RenderBody()
</div>
<footer>
</footer>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="/bootstrap/js/bootstrap.2.3.2.js"></script>
@*<script type="text/javascript" src="/scripts/main.js"></script>*@
<script>
var menuItem = $(".nav-menu-main > li > a");
var subMenu = $(".nav-menu-sub")
$(subMenu).mouseover(function () {
$(this).parent().children(menuItem).addClass("hover-active");
});
$(subMenu).mouseout(function () {
$(this).parent().children(menuItem).removeClass("hover-active");
});
</script>
</body>
</html>
There was a bug in Umbraco where a script tag near the closing body tag would be forced to lowercase.
I have submitted a pull request to Umbraco today, https://github.com/umbraco/Umbraco-CMS/pull/926 so it should be fixed in a later release