I've been programming a forum for funsies that I'll eventually be creating into a sharepoint add-in. I'm currently unable to solve an issue with the _Layout.cshtml page as in Visual Studio 2010 the page is laid out differently than it is in 2013. No problem right, I still get my page aware that there is an avatar on the nav bar however in 2013 it refuses to show then picture. Code and screenshot links provided below.
Visual Studio 2013(broken):
_Layout.cshtml 2013:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>#ViewBag.Title - Forum</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
</head>
<body>
<header>
<div class="content-wrapper">
<div class="float-left">
<p class="site-title"> <img src="#" /></p>
</div>
<div class="float-right">
<section id="login">
#Html.Partial("_LoginPartial")
</section>
<nav>
<ul id="menu">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("Forums", "Index", "Forum")</li>
<li>#Html.ActionLink("About", "About", "Home")</li>
<li>#Html.ActionLink("Contact", "Contact", "Home")</li>
<li>#Html.ActionLink("Avatar", "SelectAvatar", "Avatar")</li>
#Html.Action("Avatar", "Layout")
</ul>
</nav>
</div>
</div>
</header>
<div id="body">
#RenderSection("featured", required: false)
<section class="content-wrapper main-content clear-fix">
#RenderBody()
</section>
</div>
<footer>
<div class="content-wrapper">
<div class="float-left">
<p>© #DateTime.Now.Year - ID</p>
</div>
</div>
</footer>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/jqueryval")
#RenderSection("scripts", required: false)
</body>
</html>
LayoutController.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using LbForum.Models;
namespace LbForum.Controllers
{
public class LayoutController : Controller
{
private IStateRepository stateRepository = null;
public LayoutController()
: this(new SessionStateRepository())
{
}
public LayoutController(IStateRepository sessionStateRepository)
{
this.stateRepository = sessionStateRepository;
}
//
// GET: /Layout/
public ContentResult Avatar()
{
string imgPath = "~/Images/Avatars";
ForumUserState forumUserState = stateRepository.GetForumUserState();
if (forumUserState.AvatarFileName != string.Empty)
{
imgPath += forumUserState.AvatarFileName;
}
else
{
imgPath += "avatar1.jpg";
}
string imgTag = string.Format("<img src='{0}' alt='User Avatar' width='40' height='40'/>", imgPath);
return new ContentResult() { Content = imgTag };
}
}
}
Visual Studio 2010(fixed):
_Layout.cshtml 2010:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title - Forum</title>
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"><</span>
<span class="icon-bar"></span>
</button>
#Html.Raw(#Html.ActionLink("[replacetext]", "Index", "Home",
new { area = "" },
new { #class = "navbar-brand" })
.ToHtmlString().Replace("[replacetext]",
"<img src=\"/images/forum.jpg\" alt=\"QA Forum logo\" />"))
</div>
<div class="navbar-collapse collapse ">
<ul class="nav navbar-nav">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("Forums", "Index", "Forum")</li>
<li>#Html.ActionLink("Threads", "Index", "Thread")</li>
<li>#Html.ActionLink("Posts", "Index", "Post")</li>
<li>#Html.ActionLink("About", "About", "Home")</li>
<li>#Html.ActionLink("Contact", "Contact", "Home")</li>
<li>#Html.ActionLink("Avatar", "SelectAvatar", "Avatar")</li>
<li>#Html.ActionLink("Admin", "Index", "Admin")</li>
#Html.Action("Avatar", "Layout")
</ul>
#Html.Partial("_LoginPartial")
</div>
</div>
</div>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - ID</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/jqueryval")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
</body>
</html>
Now that we have the meat'n'potatoes...
Your 2010 example (which is working) is simply referencing /images/forum.jpg (which appears to exist as an asset on your site). So all is fine there.
The 2012 version is appears you tried to refactor into a ChildAction. By doing so you've also switched how the resource is located, referencing ~/Images/avatars instead of just /Images/avatars (note the tilde).
For the simplest "check if it works" path (and assuming your /images/forum.jpg file still exists) try just outputting a hard-coded value in your child action first:
public ContentResult Avatar()
{
string imgPath = "/images/forums.jpg"; // Hard-coded
string imgTag = string.Format("<img src='{0}' alt='User Avatar' width='40' height='40'/>", imgPath);
return new ContentResult() { Content = imgTag };
}
If that works, it has to do with the way you assemble the path. Remember locations to clients should be relative your website, so ~/ means nothing to them.
Some general guidance:
Decorate this action with [ChildActionOnly] to avoid being called directly.
Use a view and pass it the url as the model to avoid mixing logic/presentation.
Consider moving this code, altogether, into an HtmlHelper and avoid the round-trip to another controller.
Taking bullet points 1 & 2 and applying them:
LayoutController.cs:
public class LayoutController : Controller
{
/* snip */
// Hard-coded values should be const
const String AvatarDefaultImage = "avatar1.jpg";
[ChildActionOnly]
public PartialViewResult Avatar()
{
var forumUserState = stateRepository.GetForumUserState();
if (!String.IsNullOrEmpty(forumUserState.AvatarFileName))
{
// Pass off the URL as the model
return PartialView(model: forumUserState.AvatarFileName);
}
// default fallback
return PartialView(model: AvatarDefaultImage);
}
}
~/Views/Layout/Avatar.cshtml:
#model String
<img src="/Images/Avatars/#Model" alt="User Avatar" width="40" height="40"/>
Related
I want to remove this line see this below picture because when I write the index page content display upper side that is the issue
Index page:
Contact page:
_ViewStart.cshtml
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
_Layout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title - My ASP.NET Application</title>
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<div class="row">
#Html.ActionLink("abc Technology fgh", "Index", "Home", new { area = "" }, new { #class = "navbar-brand" })
<ul class="nav navbar-nav" style="margin-left:500px;">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("About", "About", "Home")</li>
<li>#Html.ActionLink("Contact", "Contact", "Home")</li>
<li>#Html.ActionLink("Tech", "Tech", "Home")</li>
<li>#Html.ActionLink("Career", "Career", "Home")</li>
<li>#Html.ActionLink("Nipos", "Nipos", "Home")</li>
<li>#Html.ActionLink("Nosm", "Nipos", "Home")</li>
</ul>
</div>
</div>
</div>
</div>
#RenderBody()
<hr />
<div class="navbar-fixed-bottom" style="margin-left:45px;">
<footer>
<p>© #DateTime.Now.Year - CopyRight#flt.com</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
</body>
</html>
Index.cshtml
#{
ViewBag.Title = "Home Page";
}
Home Page
HomeController.cs
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
}
What is the issue which place to come this unnecessary straight line? and index page content is come to render body and not display proper render body content
I don't have an idea which place come to the straight line continuously I comment and comment code but not idea which place to come this straight line trying but not remove this line?
This is a horizontal rule, just remove the <hr /> tag, under #RenderBody in _Layout.cshtml
Remove
<hr/>
tag from the html. it will create horizontal rule in the html
I created registration and login to my app. But when I login i don't see logged user. How can I do that? I create all redirection to home page when user is connected but I don't see connected user like on this site.
I was fallowing this tutorial. And all is working fine. But how can I get this?
On my site i have this:
My git. I didn't post any code, because is almost the same like in tutorial, except i added redirection to my home page.
https://github.com/ivanradunkovic/Vozila/tree/master/Vozila
Thanks
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title - Vehicle</title>
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
<script type="text/javascript">
var appInsights=window.appInsights||function(config){
function s(config){t[config]=function(){var i=arguments;t.queue.push(function(){t[config].apply(t,i)})}}var t={config:config},r=document,f=window,e="script",o=r.createElement(e),i,u;for(o.src=config.url||"//az416426.vo.msecnd.net/scripts/a/ai.0.js",r.getElementsByTagName(e)[0].parentNode.appendChild(o),t.cookie=r.cookie,t.queue=[],i=["Event","Exception","Metric","PageView","Trace"];i.length;)s("track"+i.pop());return config.disableExceptionTracking||(i="onerror",s("_"+i),u=f[i],f[i]=function(config,r,f,e,o){var s=u&&u(config,r,f,e,o);return s!==!0&&t["_"+i](config,r,f,e,o),s}),t
}({
instrumentationKey:"615aadc5-8508-46e7-aa93-713181a155ae"
});
window.appInsights=appInsights;
appInsights.trackPageView();
</script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
#Html.ActionLink("Vehicle", "Index", "Home", new { area = "" }, new { #class = "navbar-brand" })
</div>
<ul class="nav navbar-nav">
<li>#Html.ActionLink("About application", "About", "Home")</li>
<li>#Html.ActionLink("Vehicle Make", "Index", "Make")</li>
<li>#Html.ActionLink("Vehicle Model", "Index", "Model")</li>
<li>#Html.ActionLink("About author", "AboutAuthor", "Home")</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li style="color: white; line-height: 50px;">
<li>#Html.ActionLink("Login", "Login.aspx", "Login.aspx")</li>
<li>#Html.ActionLink("Register", "Register.aspx", "Register.aspx")</li>
</ul>
</div>
</div>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - Vehicle by Ivan Radunković</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
</body>
</html>
My View/Shared/_Layout.cshtml
In shared/_Layout.cshtml you have to write code if user is loggedIn then display Name and Logg Off Text else show Login and Register Text(Button).
Like :
#if(Model.IsAuthenticated)
{
<div>
{Name(Fetch from model} Logg Off
</div>
}
else
{
<div> Register Login
</div>
}
Enjoy......
If you can confirm that the users are being saved to the database then you just have to change your _Layout.cshtml:
#if(Model.IsAuthenticated)
{
"Hello " + User.Identity.GetUserName()
}
else
{
<ul class="nav navbar-nav navbar-right">
<li style="color: white; line-height: 50px;">
<li>#Html.ActionLink("Login", "Login.aspx", "Login.aspx")</li>
<li>#Html.ActionLink("Register", "Register.aspx", "Register.aspx")</li>
</ul>
}
I have a ASP.NET Web API that run on Katana and use Razorengine for generating views.
So I created a view without layout and it works as expected.
View.cshtml
<h2>View</h2>
On browser
So when I am going to add a layout like:
#{
ViewBag.Title = "View";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>View</h2>
After the request I've got just a blank site.
What am I doing wrong?
Update
The controller code:
public class CustomersController : ApiController
{
[HttpGet]
[Route("customers")]
public IHttpActionResult View()
{
return new ViewResult(Request, #"Customers\View", null);
}
}
and _Layout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title - My ASP.NET Application</title>
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
#Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { #class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
</ul>
</div>
</div>
</div>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
</body>
</html>
But when I replaced the layout with other structure:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
#RenderBody()
</body>
</html>
Then it works. The layout template is wrong.
i used this tutorial for create dropzone area in my web application mvc 5.
http://www.codeproject.com/Articles/874215/File-upload-in-ASP-NET-MVC-using-Dropzone-JS-and-H
but when i drag and drop my image, the dropzone layout doesn't work.
below is my code:
_layout
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title - My ASP.NET Application</title>
#Styles.Render("~/Content/css")
#Styles.Render("~/Content/dropzonescss")
#Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
#Html.ActionLink("Application name", "Index", "Home", null, new { #class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("About", "About", "Home")</li>
<li>#Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>
</div>
</div>
</div>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/bootstrap")
#Scripts.Render("~/bundles/dropzonescripts")
<script type="text/javascript">
Dropzone.options.dropzoneJsForm = {
//prevents Dropzone from uploading dropped files immediately
autoProcessQueue: false,
init: function () {
var submitButton = document.querySelector("#submit-all");
var myDropzone = this; //closure
submitButton.addEventListener("click", function () {
//tell Dropzone to process all queued files
myDropzone.processQueue();
});
}
};
</script>
#RenderSection("scripts", required: false)
</body>
</html>
Index
#{
ViewBag.Title = "Home Page";
}
<form action="~/Home/SaveUploadedFile" method="post" class="dropzone" id="Dropzone.options.dropzoneJsForm" >
<div class="fallback">
<input name="file" type="file" multiple />
<input type="submit" value="Upload" />
</div>
</form>
homecontroller
public ActionResult SaveUploadedFile()
{
bool isSavedSuccessfully = true;
string fName = "";
try
{
foreach (string fileName in Request.Files)
{
HttpPostedFileBase file = Request.Files[fileName];
//Save file content goes here
fName = file.FileName;
if (file != null && file.ContentLength > 0)
{
var originalDirectory = new DirectoryInfo(string.Format("{0}Images\\WallImages", Server.MapPath(#"\")));
string pathString = System.IO.Path.Combine(originalDirectory.ToString(), "imagepath");
var fileName1 = Path.GetFileName(file.FileName);
bool isExists = System.IO.Directory.Exists(pathString);
if (!isExists)
System.IO.Directory.CreateDirectory(pathString);
var path = string.Format("{0}\\{1}", pathString, file.FileName);
file.SaveAs(path);
}
}
}
catch (Exception ex)
{
isSavedSuccessfully = false;
}
if (isSavedSuccessfully)
{
return Json(new { Message = fName });
}
else
{
return Json(new { Message = "Error in saving file" });
}
}
BundleConfig add
bundles.Add(new StyleBundle("~/Content/dropzonescss").Include(
"~/Scripts/dropzone/css/basic.css",
"~/Scripts/dropzone/css/dropzone.css"));
bundles.Add(new ScriptBundle("~/bundles/dropzonescripts").Include(
"~/Scripts/dropzone/dropzone.js"));
I have no idea why it behaves this way.
The loading part is working properly, but the graphics is wrong and looks like:
It looks like the dropzone nuget package doesn't create the \css sub folder for the dropzone css files, so the bundle config is incorrect. (well it is correct but the folder isn't there).
Create the folder scripts\dropzone\css (and move the css files from the scripts\dropzone folder to that new folder)
You can see how the dropzone folder should look by looking at the solution that is on github:
Dropzone example solution
This is my main layout of the application
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title - My ASP.NET Application</title>
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top bs-docs-nav" role="banner">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
#Html.ActionLink("Date Picker", "Index", "Home", null, new { #class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("About", "About", "Home")</li>
<li>#Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>
#Html.Partial("_LoginPartial")
</div>
</div>
</div>
#if (User.Identity.IsAuthenticated)
{
<div class="row">
<div class="col-md-3">
<div class="bs-sidebar hidden-print affix" role="complementary">
<ul class="nav bs-sidenav">
<li class="active">
#Html.ActionLink("Address Book","Index","AddressBook")
<ul class="nav">
<li>
#Html.ActionLink("Add Contact", "AddPerson", "AddressBook")
</li>
</ul>
</li>
<li>
#Html.ActionLink("App", "Create", "Appointment")
</li>
<li>
#Html.ActionLink("myconn", "Index", "Connection")//error when I click this link.
</li>
</ul>
</div>
</div>
</div>
}
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - MyApp</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
</body>
</html>
I get the sidebar when the user is logged in, all the links work in sidebar except
#Html.ActionLink("myconn", "Action", "Controller")
When I click the link called SuperOffice browser link changes to http://localhost:14834/Connection
but I get error: in visual studio saying
An unhandled exception of type 'System.StackOverflowException' occurred in System.Core.dll
Here is my controller code
[Authorize]
public class Controller : Controller
{
private readonly IConnectionRepository _connectionRepository;
public ConnectionController(IConnectionRepository connectionRepository)
{
_connectionRepository = connectionRepository;
}
}
When I put breakpoint in Index method of Connection controller, and click the SuperOffice link, I don't even get to that method.
Any idea what is happening?
I find it strange that all the link are working and I get forwarded to controller and all thing works perfect except that one.
You probably have [Authorize] attribute somewhere that is giving you stackoverflow.
var hasSuperOfficeConnection = _connectionRepository.CheckIfSuperOfficeIsConnected(userId);
var model = new Index
{
IsSuperOfficeConnected = hasSuperOfficeConnection
};
I think there is a infinite loop here If you can give more code (ie IsSuperOficeConnected) we can help you more
public class ConnectionRepository:IConnectionRepository
{
private readonly DatePickerDbContext _db;
//private readonly ISuperOfficeRepository _superOfficeRepository;
public ConnectionRepository(DatePickerDbContext db)//, ISuperOfficeRepository superOfficeRepository
{
_db = db;
// _superOfficeRepository = superOfficeRepository;
}
public int GetConnectionId(string connectionName)
{
var connection = _db.Connections.Single(c => c.Name == connectionName);
return connection.Id;
}
public bool CheckIfSuperOfficeIsConnected(string userId)
{
var connectionId = GetConnectionId("SuperOffice");
var result = _db.UserConnections.Where(uc => uc.UserId == userId && uc.ConnectionId == connectionId);
return result.Any();
}
}