I am confused why Visual Studio 2010 gives me the following Validation error on my source tag.
Validation (HTML5): Element 'source' cannot be nested within element
'audio'
Below is my code in the cshtml View:
#{
ViewBag.Title = "Audio";
string audioURL = Url.Content("~/Content/Audio/untitled.mp3");
}
<div>
<audio id ="myAudio" controls preload="auto">
<source src="#audioURL" type="audio/mpeg" />
</audio>
</div>
I have been looking around, and I have seen many references to multiple src attributes in the tag. But that doesn't answer my question, why the validation error? Is it actually correct, but VS2010 thinks it wrong, or is it really incorrect, and if so, why is it incorrect?
I have found the issue, it is a bug within Visual Studio 2010, Looking though their docs I found this link
Web Standards Update for Visual Studio 2010 SP1
This is what they said about the problem, and the update should fix it.
The HTML 5 support included in SP1 added intellisense and validation for a lot of new elements such as the video and source elements. However, there were bugs and one of them were the error you would see when adding source elements inside video elements. This is being fixed by this update so you now also get intellisense for the source element.
Its the ~ character in the audioURL string ..
Quoting from similar question on forums.asp.net
~ character in the src attribute won't be reconginsed in HTML tags!
you cannot use tilder mark to go to the root level unless it's a
server control. Use .. to go to the upper directory and so on. That's
how you should define the relative path for HTML controls. For
example: src="../Mp3/RonaldReaganChallengerAddress.mp3"
Remove the quotes from the source src attribute. It's already a string
<audio id ="myAudio" controls preload="auto">
<source src = #audioURL type="audio/mpeg" />
</audio>
Related
Is it possible to add custom code snippets for Razor pages using the Code Snippets Manager in Visual Studio?
I can add snippets for HTML, but I can't find CSHTML anywhere.
I'm using Visual Studio Community 2019 16.4.1
That is because there are no dedicated Cshtml snippets. The Razor code is either C# or VB, so those snippets will be valid in a code block.
To use those snippets you simply have to open a code-block:
Either type # or #( to open an explicit statement
type foreach
type tab twice to activate the snippet
To edit the snippets, press Ctrl+K, Ctrl+B
This worked for me in Visual Studio 2019
Create and save your XML .snippet file. Example template:
<CodeSnippet Format="1.1.0">
<Header>
<Title>NameOfSnippet</Title>
<Author>YourName</Author>
<Shortcut>ShortCutName</Shortcut>
<Description>Description</Description>
<SnippetTypes>
<SnippetType>Expansion</SnippetType>
</SnippetTypes>
</Header>
<Snippet>
<Declarations>
<Literal>
<ID>Id</ID>
<ToolTip>Please add an ID</ToolTip>
<Default>REPLACE_ID</Default>
</Literal>
</Declarations>
<Code Language="html"><![CDATA[<div id="$Id$">Example HTML Snippet</div>$end$]]></Code>
</Snippet>
Tools > Code Snippet Manager > Language Dropdown: html > Import
Navigation to your .snippet file and open
Select both My HTML Snippets & HTML
Select Finish and OK
Open a cshtml file and type in your ShortCutName > hit tab
You should see your snippet in the cshtml, since language is html, and not CSharp, no need to open a code block
When I was trying to tackle this problem, the thing that was missing in my mental model was that a .cshtml file consists of multiple parts that are in their own language context. For example, you could have:
a <style></style> block that its contents would be css and VS would recognize CSS snippets in there,
a <script></script> block that has javascript content and VS would recognize javascript snippets
a # block where vs could recognize either CSharp or Basic snippets
If you aren't in one of the other spots, html snippets are recognized.
In my case, I wanted to add a javascript snippet but I thought that the available snippets were tied directly with my file type so I was trying to add them as HTML snippets (and then was disappointed when they didn't show up in my script tag).
ALSO, its important to note that at least with VS 2017, you may need to restart VS to get the editor to recognize any new snippets.
I am going thru this article here which talks about using the Razor template for Xamarin forms. I am however unable to find such a template in Visual Studio. The closest I came to was a nuget package. I don't think I can use that if I am to follow the example in the article above. Has anyone found any such problem before or can this only be done on Xamarin studio?
Why would they not make a provision for Visual Studio as well!
Just tried to use a razor template inside a Xamarin.Forms PCL and stumbled over the missing template. But then I followed the advice in the comments and it worked without any problems.
Add a new class (or whatever you want) to the portable project and name the file RazorTest.cshtml.
Replace the content of the new file with a skeleton like this:
Adjust the namespace and bind to your own ViewModel:
#using RazorTestNamespace.ViewModels
#model RazorTestViewModel
<html>
<body>
<h1>#Model.Title</h1>
</body>
</html>
Go to the class properties, find the CustomTool property and type in RazorTemplatePreprocessor. Then VisualStudio magically creates the belonging RazorTest.cs file with the code-behind.
Build the HTML when needed:
Inside the ViewModel:
RazorTest razorTest = new RazorTest { Model = razorTestViewModel };
string html = razorTest.GenerateString();
I have a question about Kendo UI. I have an existing MVC4 project in which I wanted to use some of the Kendo extensions, namely the Editor. Currently the project uses jqWidgets as a UI framework.
I opened VS 2012, loaded the project and used the Telerik menu to add references to Kendo in the project. The wizard added all the necessary references and made changes to the web.config files. So far so good. However, I have two problems:
When I try to use the Kendo Html Helper I do not have intellisense and the Kendo is underlined saying that the HtmlHelper does not have a definition for 'Kendo'. I have <add namespace="Kendo.Mvc.UI" /> in both, my main web.config as well as in the web.config in the Views folder. Strangely enough, when I run the site, I do not get an error, but the editor does not load its initial content and if I try to interract with it, I get the following error: (my second question)
TypeError: invalid 'in' operand e - I am guessing that somewhere in the site, There is a conflict that couses this error, but I cannot find it. Here is how I load all the JS files in my _Layout.cshtml:
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/jqueryui")
#Scripts.Render("~/Scripts/kendo/2013.2.918/kendo.all.min.js")
#Scripts.Render("~/Scripts/kendo/2013.2.918/kendo.aspnetmvc.min.js")
#Scripts.Render("~/Scripts/kendo.modernizr.custom.js")
I am not sure if the problems are related. My jQuery version is 1.9.1 and I am using the latest Kendo version (2013.2.918.340)
Any help would be greatly appreciated.
Here is how I use the editor in the View:
#(Html.Kendo().Editor()
.Name("editor")
.HtmlAttributes(new { style = "width: 700px; height: 400px" })
.Value(#<text>
<p>
Some text
</p>
</text>)
.ImageBrowser(imageBrowser => imageBrowser
.Image("~/Content/UserFiles/Images/{0}")
.Read("Read", "ImageBrowser")
.Create("Create", "ImageBrowser")
.Destroy("Destroy", "ImageBrowser")
.Upload("Upload", "ImageBrowser")
.Thumbnail("Thumbnail", "ImageBrowser"))
)
The solution to the first problem is to add namespace reference only to the web.config file in the Views folder. There is no need to add it to the root web.config. After that restart Visual Studio and reload your project. Everything should be fine and intellisense should work.
As for the second problem, this is hard to guess. Could you show your code where you are loading the contents into HTML editor?
I have been getting all of these "Validation (): Element 'x' is not supported" warnings and I can't seem to find a way to get rid of them. Here are two examples:
Validation (XHTML 1.0 Transitional): Attribute 'name' is not a valid attribute of element 'ul'.
Validation (CSS 2.1): 'border-radius' is not a known CSS property name.
I have searched on the web and all solutions point to removing the following folder:
C:\Users\{username}\AppData\Roaming \Microsoft\VisualStudio\10.0\ReflectedSchemas
Which seems to fix 90% of people's issues, however I don't have that folder anywhere on my computer!
I am using Visual Studio 10 SP1 and this project is an MVC 3 project using Razor and HTML5.
So can anyone else suggest what else might be causing the issue?
Thanks very much.
I was encountering the same problem and ALL classic html elements (div, a, p, table..) in every page had green underlines. Intellisense did not give any help with these elements, as if they didn't exist. But all asp controls were fine and valid.
The error was the xmlns="https://www.w3.org/1999/xhtml" in the html tag in my master page. Html 5 does not seem to work well together with the xmlns declaration so I removed it, and voila - everything magically works again!
Those are valid warnings, not a bug or other sort of "issue." The list of valid attributes for <ul> is given in the W3C standards, and it doesn't include name. Meanwhile, border-radius was introduced in CSS 3, which means if you validate against CSS 2.1 it's not going to work.
You can either ignore them or figure out how to suppress those particular warnings in VS2010 (I know how to do that for VC++, but I haven't used VS for HTML before; there should be some section in the Properties window for it).
First of all you need to know it's not an error!
Steps to resolve the warning message for an element.
Right click the warning area, you will see a context menu.
Click "Formatting and Validation..." basically it's at the bottom of the menu.
Go to "Validation" in "HTML or HTML (Web Forms)" section. You'll see a checkbox with "Show errors" is checked to true with header "Options". Just unchecke it.
enter image description here
enter image description here
That's it, you are done...
You have to remove
xmlns="https://www.w3.org/1999/xhtml"
let it remain
<!DocType Html>
only above
I am trying to get Jquery intellisense working in Visual Studio 2010.
I've looked around on StackOverflow and tried adding this to my view:
#{
/// <reference path="/Scripts/jquery-1.5.1-vsdoc.js"/>
}
That's not working.. I've got it working by adding the same script tag to each view but this is less than ideal since i want to keep all my scripts in one place at the bottom of my layout page.
Add the <script> tags to each view inside an #if (false) { ... } block.
The IDE will still see them, and provide IntelliSense, but they won't do anything at runtime.