My question is: How can I add meta tag from my view or partial view? Basically I want to, from the view, write a meta tag, and I want it to be displayed in the header. Is it possible?
Thank you
H
You can use sections to do this.
In you layout page you need to define the section:
<head>
#RenderSection("Head", required: false)
</head>
This section can then be used in any page that uses this layout page:
#section Head {
<meta ... >
}
Related
Reading through the Grails docs (see here http://grails.org/doc/latest/guide/theWebLayer.html#ajax), I was led to believe that I could use Ajax to update a div using the following syntax:
My view (Ajax/index.gsp)
<!doctype html>
<head>
<meta name="layout" content="main"/>
</head>
<body>
<div id="error"></div>
<div id="message"></div>
<g:remoteLink action="retrievePets" update="message">Ajax magic... Click here</g:remoteLink>
</body>
</html>
My controller (AjaxController):
package genericsite
class AjaxController {
def index() { }
def retrieveMessage() {
render "Weeee! Ajax!"
}
}
However, when I select the link, it just sends me to a page with "Weeee! Ajax!" I know how to do this the typical jQuery way. This is slightly more convenient...
The default "main" layout doesn't include a javascript library by default, so if you want to use remoteLink or any of its associates you'll need to add
<r:require module="jquery"/>
or (if you're on a pre-2.0 version of Grails or not using the resources plugin)
<g:javascript library="jquery"/>
to the <head> section of your GSP.
This is my _Layout.cshtml
<html>
<head>
#RenderSection("Script", false)
</head>
...
</html>
This is a simple edit page edit.cshtml
#model Shop.Models.Product
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
#Html.EditorForModel()
and this is ~/Views/Shared/EditorTemplates/Product.cshtml
#model Shop.Models.Product
#section Script {
<script>alert("hello");</script>
}
...
#section Script{...} does not work in Product.cshtml because of EditorForModel. How can do it?
Sections work only in views, not in partials. An editor template is a special kind of partial. It's bad practice to put javascript in partials anyway, so I would simply declare the section in the Edit.cshtml view.
But if you very much insist on putting your scripts in the middle of your markup, since Razor doesn't support sections in partials, you could implement custom helpers to achieve that.
How can I put meta tag to work only for one page. If I want to put it .aspx file, where is right place.
Thanks.
Since you haven't said yet, I'm assuming you're using the Razor engine (the "default" for new MVC3 projects). In that case, you just need to insert a new section into your layout view, and only render that section if you need to insert a meta tag.
For example, working from the stock New ASP.NET MVC 3 Project template, you would edit your Views\Shared\_Layout.cshtml file, and before the closing </head> tag, do something like this:
#this.RenderSection("MetaContent", false)
</head>
Then, in any of your views that you needed to, add this:
#section MetaContent
{
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
}
If you're still using the ASPX layout engine for some reason, you can accomplish the same thing using the <asp:ContentPlaceHolder> tags in your master page and <asp:Content> tags in your views.
EDIT:
Since you're using the ASP.NET Forms layout engine still, here's the same basic idea as above in aspx syntax:
In your master page, you add the tag:
<asp:ContentPlaceHolder ID="MetaContent" runat="server" />
</head>
And in your .aspx views, you add a new content section (you should already have at least two -- a title and a body):
<asp:Content ID="Meta" ContentPlaceHolderID="MetaContent" runat="server">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
</asp:Content>
I was going to suggest exactly what Michael said (+1). Another option would be to put a boolean in the ViewBag, something like:
ViewBag.ForceIE8Mode = true;
For pages that you want to force into IE8 Mode.
and then in your view, wrap the meta tag in a conditional. either
#if(ViewBag.ForceIE8Mode == true) {
<meta... />
}
or
<% if(ViewBag.ForceIE8Mode == true) { %>
<meta... />
<% } %>
I currently have a master layout page with a default title, and meta content. How can I override the title and meta content in child pages?
I found a way that works for now. I'm wure it can be improved, but this is the closet thing to an ideal solution that I have come across.
In the controllers assign whatever meta info you need for that view.
ViewBag.Title = "some title";
ViewBag.MetaDescription = "some description";
etc...
and in the master layout page I do the following
<title>#ViewBag.Title</title>
#if(ViewBag.MetaDescription != null)
{
<meta name="description" content="#ViewBag.MetaDescription" />
}
#if(ViewBag.MetaKeywords != null)
{
<meta name="keywords" content="#ViewBag.MetaKeywords" />
}
define a ContentPlaceHolder (#RenderSection in Razor) and fill it in the views that use the master page, using Content (#section in Razor).
I want to set the height of WebBrowser control dynamically, depending on the content height.
My scenario is: On that specific view I have different elements - an Image, MediaElement etc. and between those rich text that is presented in that WebBrowser control. To achieve unified scrolling I have wrapped all content in a scrollview and disabled scrolling on the webbrowser control.
Currently I have a JavaScript method that gets called when body has done loading and sends the height information to C# codebehind but the calculated height is incorrect.
My hack today is to basically multiply the returned value with about 1.75.
In the page head I have the following meta tags:
<meta charset='Windows-1257'>
<meta name='viewport' content='width=device-width' />
<meta name='viewport' content='user-scalable=no' />
<meta name='viewport' content='initial-scale = 1.0' />
<meta name='HandheldFriendly' content='true' />"
<meta name='target-densitydpi=device-dpi' />
This is my body tag.
<body onLoad="SendDataToPhoneApp()" style="margin:0px;padding:0px;">
My JavaScript functions:
<script>
function getDocHeight() {
return document.getElementById('pageWrapper').offsetHeight;
}
function SendDataToPhoneApp() {
window.external.Notify('' + getDocHeight());
}
</script>
pageWrapper is a direct child of body.
Try using document.body.clientHeight in your Javascript. Also you might have better luck with your scenario if you construct everything inside the WebBrowser. You can put images in the HTML of course and you could put a still-frame placeholder image for your MediaElement, calling back into C# and poping up a real MediaElement when needed.