How to include header, footer, sidebar to webpage in asp.net c#? - c#

I newly joined asp.net, I am little bit confused how to add header/footer to webpage?
I am using visual studio 2012.
We use include,require predefined functions in PHP.
I dont know what we use in asp.net for none changeable blocks for website.
Please advise me.
Thanks

Using Masterpages, allows you to create master copies of your header, footer, sidebar and what else. All your "content" pages inherit the masterpage, and renders in a predefined "content area" inside the masterpage.
Create a masterpage, it should have a default "content placeholder". Build your masterpage around it, and when adding a new page, choose "content page", or in earlier Visual Studio editions, page, and check the box that says "use masterpage".
You will then see your new content page with the masterpage faded out on the background, and you can build your content page.
Calling the content page (normal page that is bound to a masterpage), always renders the masterpage and the content page as one page to the screen.

use master page and add header div and footer as you need.
<div style="margin-left: 38%; width: 25%;">
Header
</div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
<div style="margin-left: 38%; width: 25%;">
<hr style="color: #1B3280; border-width: thin; width: 98%;" />
</div>
<div>
<asp:Label ID="Label" runat="server" CssClass="rights" Font-Size="12px" Font-Names="Calibri"
Text="All rights reserved."></asp:Label>
</div>

Related

A page can only have one server-side form tag, but I need two

currently my ASP.NET web application is using a master page, nested master page and a content page. On the nested master page I have a content placeholder for navigational links, and another for the main content. The reason as to why I have two is because my main masterpage has already determined a fixed format for the rest of my pages, and I'm using nested masterpages because I need different types of navigational links for different roles used in my website. However, for the navigational links a LinkButton is used for the sign out button, thus it requires me to use a form tag with a runat="server" in order for me to be able to run the page. However, in my content page, I also need a form runat="server" tag for my main content. :-( Does anyone have an idea to propose on how to fix this problem? I want to stick to using multiple content placeholders so minor changes won't affect the entire page.
Anyways here's a snippet of my code from the masterpage
<asp:Content ID="Content1" ContentPlaceHolderID="navigationlinks" runat="server">
<form id="navForm" runat="server">
<a class="toggleMenu" href="#">
<img src="images/nav_icon.png" alt="" />
</a>
<ul class="nav" id="nav">
<li class="current">Home</li>
<li>Competition</li>
<li>Gallery</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Discussions
</a>
<ul class="dropdown-menu">
<li>Create Discussion</li>
<li>View Discussion</li>
</ul>
</li>
<li>Submission</li>
<li>Results</li>
<li>My Account</li>
<div class="clear"></div>
</ul>
<script type="text/javascript" src="js/responsive-nav.js"></script>
</form>
<asp:Content ID="Content3" ContentPlaceHolderID="Content1" runat="server">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"></asp:ContentPlaceHolder>
</asp:Content>
ContentPlaceHolder1 is used for the main content in the content page. So even with the form tag already in "navigationallinks" I'll need another form tag
in my content page, I also need a form runat="server" tag for my main content.
You already have it since this page have a masterpage which include server-side form tag!
When you have a masterpage with
<form runat="server">...</form>
All pages using that masterpage will have the form, and no need to add it again in the page!
Edit:
Just remove all form tags inside any page or nested masterpage, and add it the masterpage wrapping all the elements.
Inside the masterpage that has the <body> tag, right after the body add the <form runat="server"> tag and close it just before the </body>. And remove all the other form tags.

position a label in the end of a webpage(masterpage) in a c# webpage

Im creating a website in c# asp.net,i desgined the master page,i added a link(our email id,indicating we are the developers)but,the content pages have gridviews which are not paged,so the length of the gridview varies based on the data,in all content pages using this master page.Because the length of gridview varies,when its long,the link's position seems to be in the middle of the page.I want our link to be in the bottom of the webpage.How to do this,pls help.
I think you html footer might be more useful to you.
<footer>
<p>Developed by: user2740323</p>
<p>Contact information: <a href="mailto:someone#example.com">
someone#example.com</a>.</p>
</footer>
you can add a footerPlaceHolder to your masterpage like this:
<asp:ContentPlaceHolder ID="FooterPlaceHolder" runat="server">
<div>
your info
</div>
</asp:ContentPlaceHolder>

How to change image without refreshing the page

I have a website where the user can select different cards. I need a way where when a new card is selected then the page does not refresh. When I click the back button now it just goes back to previous selections. I need it to go back to the previous page. Here is the code for the image change
<div class="imgCard" style="padding-right: 50px">
<asp:ScriptManager ID="ScriptManager" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional">
<ContentTemplate>
<fieldset style="border-width: 150px; border-style: none">
<asp:Image ID="imgCardChoice1" runat="server" />
<br />
<br />
<a id="openChange1" href="#" style="color: Red">Change Card</a>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
</div>
When the user clicks on "Change Card" then a jquery modal box opens and allows them to change the card. Thank you for any help/advice. If needed the code behind to select a new card is in C#.
Without knowing more, it sounds like you need to use AJAX to do that. If you are already using jQuery, check out jQuery.load(). You can make an AJAX request to a url on your site that will only return the image information and load that into the element you specify.
Here is a link to the docs:
http://api.jquery.com/load/
Try to use some javascript function.
create a div where you want to put your image.
then give him an ID, on javascript function call the div id and change the src to the image that you want to put.
on your link or wathever you have to change the image, call the onclick function and use the javascript function.
On my website i have 2 images, that onmouseover change an image in other div completely different.
see it on:http://roundhillevents.com
and pass the cursor on the facebook and on the youtube logo's.
If nothing appears, let stay the cursor over that a little while.
PS: Only works with forefox and don't know why.

My banner appears in visual studio, but doesn't appear when I upload the site.master. Why is this?

I have a site.master in my root, and a site.master in my /blog/ directory.
I want to modify the site.master in my /blog/ directory to make my site look as uniform as possible. So I started by putting my banner in the coding, which looks great in Visual Studio.
But when I upload the edited site.master, although the favicon shows up, the banner completely disappears -- like it's not there.
My coding in my /blog/ site.master is this:
<link rel="shortcut icon" href="~/favicon.ico" />
<link rel="icon" type="image/gif" href="~/img/RTN_favicon.GIF" />
<link rel="stylesheet" href="style-min.css" type="text/css" />
</head>
<body>
<form runat="Server" class="body">
<div id="header">
<asp:Image ID="HyperLink1" runat="server" ImageUrl="~/img/RTN_banner.jpg"
Style="height: 250px; width: 960px;" NavigateUrl="~/" />
<p>
<a href="<%=Utils.AbsoluteWebRoot %>">
<%=BlogSettings.Instance.Name %>
</a>
</p>
<span>
<%=BlogSettings.Instance.Description %></span>
</div>
In VS, the RTN_banner shows up, but when I go to upload this, it's like the banner isn't there -- there's not even a 960 x 250 empty space! But my favicon shows up. Does anybody have any idea why I cannot get RTN_banner to show up? Thank you for any guidance!
EDIT:
Here's a picture of my properties for the /blog/ site.master banner. What's peculiar is that there's no behavior for "Enabled", like all my other pictures do. In my root site.master, there is a behavior set to "true" ... I don't know if this is the issue or not.
The image file should be a part of your project and there is an option that tells Visual Studio to include the file in an output package.
The image file is located in ~/img/RTN_banner.jpg according to your code. If you view the properties of this file, you can set the Build Action to Content. That way, the image file will be copied to your server and it will show online.
You can find the MSDN documentation for this property here: File Properties
This may be a bug in VS, but I noticed that this code:
<asp:Image ID="HyperLink1" runat="server" ImageUrl="~/img/RTN_banner.jpg"
Style="height: 250px; width: 960px;" NavigateUrl="~/" />
Which is what my toolbox inserted into the code when I inserted the image. /blog/img/RTN_anner.jpg which doesn't exist; it didn't look in my root/img/RTN_banner.jpg.
I just solved this by putting in the absolute path to the image, and now things work properly.
<asp:Image ID="HyperLink1" runat="server"
ImageUrl="http://domain.org/img/RTN_banner.jpg" Style="height: 250px;
width: 960px;" NavigateUrl="~/" />

master page in umbraco

i'm programming in asp.net with umbraco and have a problem with master page.
i made a master page then added a web user master page that link in my default page.
at run time project in umbraco when i click on link saw this error :
Page not found
No umbraco document matches the url
'http://localhost:20771/WebForm1.aspx'
umbraco tried this to match it using this xpath query'/root/*
[#urlName = "webform1"] | /root// [#urlName = "webform1"]')
This page can be replaced with a custom 404 page by adding the id of
the umbraco document to show as 404 page in the
/config/umbracoSettings.config file. Just add the id to the
'/settings/content/errors/error404' element.
For more information, visit information about custom 404 on the
umbraco website.
This page is intentionally left ugly ;-)
i search in web and did not find any solution about it.
Check that your master page shows up in the admin area via Settings > Templates.
Then, check that your content page (in the admin Content section) has a template defined (under "Generic properties"). If it doesn't, and it doesn't let you select a template, then you need to allow that template to be used for that particular node type.
Go to Settings > Document Types, select your node type, and under "Allowed templates", select the template that you wish to us for the page (you may select a nested masterpage, it should still work just fine) - also make sure that the "Default allowed template" underneath is selected to your chosen template. Once you have hit "Save", go back to your node in the Content section, go to the "Generic properties" tab, and select the template you wish.
Umbraco lets you use any number of masterpages for rendering a content node. When creating new nodes, you then choose the template you wish to use (or use the default, as specified by following the above instructions).
You can also force a different template to be used at runtime, using the ?altTemplate=MyTemplateName querystring option on your page URL - handy for mobile sites, RSS views, and suchlike.
In Master.master page (it's general master page.) you can locate asp:ContentPlaceHolder
please attention to this code.Perhaps it's help you.
<div style="vertical-align: top;">
<umbraco:Macro ID="Macro1" Alias="NavigationControl" runat="server"></umbraco:Macro>
</div>
***<div>
<asp:ContentPlaceHolder ID="DefaultPageContent" runat="server">
</asp:ContentPlaceHolder>
</div>***
<div>
<asp:ContentPlaceHolder ID="TextPageContent" runat="server">
<!-- Insert default "ContactUsContent" markup here -->
</asp:ContentPlaceHolder>
</div>
<div>
<asp:ContentPlaceHolder ID="AtAGlanceContent" runat="server">
</asp:ContentPlaceHolder>
</div>
<div id="footer">
<uc6:FooterControl ID="FooterControl1" runat="server" />
</div>
</div>
</form>

Categories

Resources