1
I have this layout page. This layout already came, I didn’t make it. I just don’t understand why it was created if I opted for a MVC Empty(Empty) project, but it’s not bothering me.
<!DOCTYPE html>
<html ng-app="PedidoApp">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
<link href="~/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="~/Scripts/modernizr-2.6.2.js"></script>
@Styles.Render("~/bundles/bootstrap")
@Styles.Render("~/bundles/Estilo")
@Scripts.Render("~/bundles/angularjs")
@Scripts.Render("~/bundles/app")
</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" })
@Html.ActionLink("Pedido", "Pedido", "Pedido", 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 - Logística e Transporte</p>
</footer>
</div>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
</body>
</html>
On my page, I made a Fieldset as a test:
<form>
<fieldset class="scheduler-border">
<legend class="scheduler-border">Start Time</legend>
<div class="control-group">
<label class="control-label input-label" for="startTime">Start :</label>
<div class="controls bootstrap-timepicker">
<input type="text" class="datetime" type="text" id="startTime" name="startTime" placeholder="Start Time" />
<i class="icon-time"></i>
</div>
</div>
</fieldset>
</form>
And my file BundleConfig.cs
public class BundleConfig
{
public static void RegisterBundles(BundleCollection bundles)
{
bundles.IgnoreList.Clear();
bundles.Add(new StyleBundle("~/bundles/bootstrap").Include(
"~/Content/bootstrap.min.css",
"~/Style/jumbotron-narrow.css"));
bundles.Add(new ScriptBundle("~/bundles/angularjs").Include(
"~/Scripts/angular.js"));
bundles.Add(new ScriptBundle("~/bundles/Estilo").Include(
"~/Content/Estilo.css"));
}
}
I put a Jumbotron and it didn’t work. That file BundleConfig.cs i made in hand. Below a screenshot of the screen with the fieldset. See that the fieldset does not close and two lines appear in parallel.
My global.asax.Cs
protected void Application_Start()
{
AreaRegistration.RegisterAllAreas();
RouteConfig.RegisterRoutes(RouteTable.Routes);
BundleConfig.RegisterBundles(BundleTable.Bundles);
}
EDIT1
Failed to load Resource: the server responded with a status of 404 (Not Found) angular.js:4957 Uncaught Error: [$injector:modulerr] Failed to instantiate module Pedidoapp due to: Error: [$injector:nomod] Module 'Pedidoapp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the Second argument. http://errors.angularjs.org/1.6.6/$injector/nomod? P0=Pedidoapp at http://localhost:29348/Scripts/angular.js:116:12 at http://localhost:29348/Scripts/angular.js:2297:17 at ensure (http://localhost:29348/Scripts/angular.js:2218:38) at module (http://localhost:29348/Scripts/angular.js:2295:14) at http://localhost:29348/Scripts/angular.js:4933:22 at foreach (http://localhost:29348/Scripts/angular.js:410:20) at loadModules (http://localhost:29348/Scripts/angular.js:4917:5) creatat Injector (http://localhost:29348/Scripts/angular.js:4839:19) at doBootstrap (http://localhost:29348/Scripts/angular.js:1949:20) at bootstrap (http://localhost:29348/Scripts/angular.js:1970:12) http://errors.angularjs.org/1.6.6/$injector/modulerr? P0=Pedidoapp&p 1=Error%3A%20%5B%24injector%3Anomod%5D%20Module%20'Pedidoapp'%20is%20not%20available! %20You%20either%20misspelled%20the%20module%20name%20or%20forgot%20to%20load%20it. %20If%20registering%20a%20module%20ensure%20that%20you%20specify%20the%20dependencies%20as%20the%20second%20argument. %0Ahttp%3A%2F%2Ferrors.angularjs.org%2F1.6.6%2F%24injector%2Fnomod%3Fp0%3DPedidoApp%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A116%3A12%0A%20%20%20at%20http%3A%2F%localhost%3A29348%2Fcripts%2Fcripts%2Fangular.js%3A2297%3A17%0A%20%20%20%20at%20at%20%20%20%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A2218%3A38)%0A%20%20%20%20at%20module%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A2295%3A14)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A29348%2Fcripts%2Fjs%3A4933%3A22%0A%20%20%20%20at%20forEach%20%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A410%3A20)%0A%20%20%20%20at%20loadModules%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A4917%3A5)%0A%20%20%20%20at%20createInjector%20(http%2A%2Flocalhost%3A29348%2Fcripts%2Fangular.js%3A4839%3A19)%0A%20%20%20%20at%20doBootstrap%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A1949%3A20)%0A%20%20%20%20%20at%20bootstrap%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A1970%3A12) at http://localhost:29348/Scripts/angular.js:116:12 at http://localhost:29348/Scripts/angular.js:2297:17 at ensure (http://localhost:29348/Scripts/angular.js:2218:38) at module (http://localhost:29348/Scripts/angular.js:2295:14) at http://localhost:29348/Scripts/angular.js:4933:22 at foreach (http://localhost:29348/Scripts/angular.js:410:20) at loadModules (http://localhost:29348/Scripts/angular.js:4917:5) creatat Injector (http://localhost:29348/Scripts/angular.js:4839:19) at doBootstrap (http://localhost:29348/Scripts/angular.js:1949:20) at bootstrap (http://localhost:29348/Scripts/angular.js:1970:12) http://errors.angularjs.org/1.6.6/$injector/modulerr? P0=Pedidoapp&p 1=Error%3A%20%5B%24injector%3Anomod%5D%20Module%20'Pedidoapp'%20is%20not%20available! %20You%20either%20misspelled%20the%20module%20name%20or%20forgot%20to%20load%20it. %20If%20registering%20a%20module%20ensure%20that%20you%20specify%20the%20dependencies%20as%20the%20second%20argument. %0Ahttp%3A%2F%2Ferrors.angularjs.org%2F1.6.6%2F%24injector%2Fnomod%3Fp0%3DPedidoApp%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A116%3A12%0A%20%20%20at%20http%3A%2F%localhost%3A29348%2Fcripts%2Fcripts%2Fangular.js%3A2297%3A17%0A%20%20%20%20at%20at%20%20%20%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A2218%3A38)%0A%20%20%20%20at%20module%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A2295%3A14)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A29348%2Fcripts%2Fjs%3A4933%3A22%0A%20%20%20%20at%20forEach%20%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A410%3A20)%0A%20%20%20%20at%20loadModules%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A4917%3A5)%0A%20%20%20%20at%20createInjector%20(http%2A%2Flocalhost%3A29348%2Fcripts%2Fangular.js%3A4839%3A19)%0A%20%20%20%20at%20doBootstrap%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A1949%3A20)%0A%20%20%20%20%20at%20bootstrap%20(http%3A%2F%2Flocalhost%3A29348%2FScripts%2Fangular.js%3A1970%3A12) at http://localhost:29348/Scripts/angular.js:116:12 at http://localhost:29348/Scripts/angular.js:4957:15 at foreach (http://localhost:29348/Scripts/angular.js:410:20) at loadModules (http://localhost:29348/Scripts/angular.js:4917:5) creatat Injector (http://localhost:29348/Scripts/angular.js:4839:19) at doBootstrap (http://localhost:29348/Scripts/angular.js:1949:20) at bootstrap (http://localhost:29348/Scripts/angular.js:1970:12) at angularInit (http://localhost:29348/Scripts/angular.js:1855:5) at http://localhost:29348/Scripts/angular.js:33884:5 At Htmldocument.Rigger (http://localhost:29348/Scripts/angular.js:3468:5)
Beauty, pnet. You have added the Bundleconfig.Cs class to Global.asax.Cs?
– Carlos Scherer
Why don’t you create the standard Asp.net mvc project already with the layout? I think it’s easier to take what you don’t want than to set everything up on the arm.
– Pablo Tondolo de Vargas
@Carlosscherer, yes, I edited the post and put global.asax.Cs there
– pnet
@Pablotondolodevargas, this way there will be no learning. I need to do to understand the thing. It has to be on the same arm, it is more didactic. This is a test for a carrier.
– pnet
Console in browser shows some error?
– Carlos Scherer
@Carlosscherer, only error in Angular, but I still haven’t done anything in it, I just declared. I edited the post and put there the error in the console.
– pnet
Well, your Bundle is working because he located Angularjs. Remove the link tag where the duplicated Bootstrap is and check if the header matches as it is applying Bootstrap.
– Carlos Scherer
@Carlosscherer, although I have posted without the comment, in the code I am using, the link tags are all commented. I just left the Renderers on.
– pnet
@pnet Is the ~/Style/Jumbotron-Narrow.css file really in this folder? Because there is no problem with the bootstrap since it is being applied to its header as well as Angularjs. So there is no problem with the Bundle.
– Carlos Scherer