Suppose I have a _Layout.cshtml where I render a left sidebar, which is common to every page of my website.
Something along these lines - a menu, for example
<div id="left-sidebar">
#Html.Action("_MenuView", "LeftSideMenu")
</div>
A feature I would like to have would be to add another partial view, but only display it in certain sections of the website.
For example, in the blog section I may want to display a list of post categories or a treeview of the posts.
<div id="left-sidebar">
#Html.Action("_MenuView", "LeftSideMenu")
#if ("???")
{
#Html.Action("_BlogTreeView", "BlogEntries")
}
</div>
How could I do that? I know that I want to display "_BlogTreeView" if the view I'm rendering is returned by BlogController ... where do I go from there?
In your layout, add this section
#RenderSection("blogEntries", false)
Then in every view where you want to show the partial view add this:
#section blogEntries {
#Html.Action("_BlogTreeView", "BlogEntries")
}
Related
I hope to get some useful input on how to implement my desired functionality:
I've got a razor partial view without a model that contains the navigation for my webapp. As some functions are only ment to be available for specific users, I want to customize the view.
In particular I want to show/not show specific li elements in the ul.
I already have a query which determines whether the element needs to be shown or not.
The element itself has to be like this:
<li>#Resources.Label1</li>
How would I achieve this?
You should be able to use the ViewBag.
Main view or controller:
ViewBag.LoggedIn = true;
Partial view:
<ul>
<li>Visible to everyone</li>
#if (ViewBag.LoggedIn == true) {
<li>Visibility based on some data</li>
}
</ul>
I have a table of menu and use partial view to show it but my problem is that how to show this menu in all pages of website or how to show the partial view content in layout page.thnx
In your _PublicLayout.cshtml file, (this is the file every other page uses in your project. The file has a #RenderBody() section, so every view you make, will appear there.
But if you want to make a partial view and it needs to be displayed on all pages of your project, you can place that in the _PublicLayout file.
So for your navigation, make the partial view, and add it like this in your _layout.cshtml file:
<div id="nav">#Html.Partial("_NameOfTheFile")</div>
<div id="body"></div>
<div id="footer"></div>
I have some base layout with site structure. In this default layout I define header tag, body structure and footer:
<html>
<head>...</head>
<body>
<div id="sidebar">...</div>
<div id="entry">#RenderSection("Entry", true)</div>
<div id="footer">...</div>
</body>
Each action in each controller defines in their view own entry section.
<!-- in View/Index.cshtml -->
#section Entry {
Hello from Index action.
}
<!-- in View/Uploads.cshtml -->
#section Entry {
Hello from Uploads action.
}
<!-- in View/Users.cshtml -->
#section Entry {
Hello from Users action.
}
But I also want define different sidebars for each controller. If I put #RenderSection("SideBar", true) in main layout I must repeat sidebar code for each controllers action. I also can't define sidebar design code in main layout because I want use different sibebars for each controller (but I want use same sidebar for each action in controller).
How can I solve this problem without repeating sidebar design code in each view?
I find solution https://stackoverflow.com/a/5573970 but it will be require duplication base site structure for each controller.
Thanks for answers and sorry for my bad english :(.
Put #RenderSection("SideBar", false)
Then you can define the section for certain controller layouts only.
You might want to define separate layouts for each controller and each view in this controller will use controller layout (where you can put your sidebar) instead of default layout. Controller layouts will use default layout.
I have some partial views that are rendered sequentially. I would like to create a log of what has rendered successfully on the top of the page, when the last partial view has completed. The only way I can think of, is to keep an array of log details and then display the log detail in a partial view on the top of the page, using a rendersection.
This to me seems cumbersome, I would prefer to be able to use HttpResponse.Write to display it to the page. However this way I don't seem to be able to control the ordering of where my log will appear on the screen. I would like them to be displayed in the same location on the page. Is there a more elegant solution?
Why not put div in the top of the page and every Partial View write to that div?
<div id=log > <label id="logs"> The Log: </label> </div>
$('#logs').after('what you want1'); // from partial 1
$('#logs').after('what you want2'); // from partial 2
$('#logs').after('what you want3'); // from partial 3
$('#logs').after('what you want4'); // from partial 4
Pass the partial view the data you want to "log" in the Model\ ViewBag and start logging!
Is there a way to scroll or jump down a page after rendering it?
Specifically, in my controller action, there are some situations where I'll want to send the user to a particular place on the page. If it were just a link from another page, I'd probably use a URI fragment identifier - "http://blorg.com/page#id" - but this needs to be dynamically generated depending on some condition.
Maybe I need to use JavaScript (Prototype) somehow, but I don't know how to call the function once the page is done loading, especially from the controller.
You should really do this type of thing in your view. In your controller you should evaluate your condition to determine the part of the page you want to show, then pass the result into the view. You can then be able to use this information in your view to add a small piece of javascript at the bottom of the page that does something like the following. Of course this doesn't help you if the user has javascript turned off ;)
Controller code:
def index
# evaluate the condition
#section = (rand*10).to_i
end
View view code:
<div id="#section1">some stuff</div>
....
<div id="#section9">other stuff</div>
<% if #section>0 %>
<script type="text/javascript">
// <!--
document.location.hash="#section<%= #section %>";
// -->
</script>
If you are using jQuery, an an answer could be as follows:
$("body").scrollTop($("#my-element").position().top;
Or if you want to be really fancy (recommended), you can animate the scroll top like so:
$("body").animate({scrollTop: $("#my-element").position().top},1000);
you can have browser scroll to a position down the page by including a fragment part in the url that links to the page. e.g. http://example.com/index.html#section3 will scroll the page to the element with 'id' section3. you can use that id on a link, paragraph, etc. the browser will make sure the element is visible after the rendering.