I have a bootstrap navbar with some items, but when I click on it, nothing happens. In the console of the Chrome, isn't showing any error.
I added the tags as the bootstrap site asks.
Someone have any idea of what's wrong?
Above is my _Layout.cshtml code:
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>p.align{padding-left: 2em }</style>
<title>#ViewData["Title"] - PakaPaka Store</title>
<environment include="Development">
<link rel="stylesheet" href="~/Content/site.css"/>
</environment>
<!-- Bootstrap -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css"
integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light">
<a class="navbar-brand"> <img src=#ViewBag.Logo height="50"></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" asp-controller="Site" asp-action="Index">Home<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" asp-controller="Dash" asp-action="Products">Produtos</a>
</li>
<li class="nav-item">
<a class="nav-link" asp-controller="Site" asp-action="Contact">Contato</a>
</li>
</ul>
</div>
</nav>
<div class="container body-content">
#RenderBody()
<footer>
<hr />
<p class="align">
<a href="https://www.instagram.com/pakapaka.store/">
<i class="fab fa-instagram fa-lg"></i>
</a>
<a href="https://www.facebook.com/pakapaka.store/">
<i class="fab fa-facebook-square fa-lg"></i>
</a>
</p>
<p class="align">© 2018 - Desenvolvido por: Hatsumi Higuchi Hashinaga</p>
</footer>
</div>
<environment include="Development">
<script src="~/Content/site.js" asp-append-version="true"></script>
</environment>
#RenderSection("Scripts", required: false)
<!-- Bootstrap -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
</body>
The way you're doing is a .Net Core way. Using .Net Framework you can use an specific syntax to define links to controllers, like so:
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>#Html.ActionLink("Início", "Index", "Home")</li>
<li>#Html.ActionLink("Sobre", "About", "Home")</li>
<li>#Html.ActionLink("Contato", "Contact", "Home")</li>
</ul>
For more info you can check the docs.
Related
heyyy, i'm new in coding with asp.netcore. I created an application for medical deparment
** Upon hitting the url I got the error message:
RenderBody has not been called for the page at '/Views/_ViewImports.cshtml'. To ignore call IgnoreBody(). here's the page :
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>#ViewData["Title"] - Texte</title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="~/css/site.css" />
</head>
<body>
<header>
<nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
<div class="container">
<a class="navbar-brand" asp-area="" asp-controller="Home" asp-action="Index">Texte</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target=".navbar-collapse" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse d-sm-inline-flex flex-sm-row-reverse">
<ul class="navbar-nav flex-grow-1">
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Index">Home</a>
</li>
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<div class="container" body-content>
<main role="main" class="pb-3" >
#RenderBody()
</main>
</div>
<footer class="border-top footer text-muted">
<div class="container">
© 2021 - Texte - <a asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
</div>
</footer>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
#RenderSection("Scripts", required: false)
</body>
</html>```
So in my view looks like this below :
#model IEnumerable<PermissionManagement.MVC.Models.Brand>
#{
ViewData["Title"] = "Index";
Layout = "~/Views/_ViewImports.cshtml";
}
Help would be appreciated
Thanks
I think you have a bug in your view. _ViewImports contains html helpers only. Try to remove
Layout = "~/Views/_ViewImports.cshtml";
Your Layout is in "Shared" folder and it is called _Layout.cshtml. Move layout there if it is in another folder.
I use a _layout cshtml to get all the same start screen. It works on the index page but when i go to the next the css of bootstrap is missing. I added a bootstrap layout but know it doesnt do the layout on the next screen. I could also send you the zip if you want with all the code. The index false exist out only the layout page without any content when you go to an other page you get the text of the layout but not the bootstrap css
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>#ViewData["Title"] - Project</title>
<environment include="Development">
<link href="https://fonts.googleapis.com/css?family=Noto+Serif:400,400italic,700|Open+Sans:300,400,600,700" rel="stylesheet">
<link href="css/bootstrap.css" rel="stylesheet" />
<link href="css/bootstrap-responsive.css" rel="stylesheet" />
<link href="css/fancybox/jquery.fancybox.css" rel="stylesheet">
<link href="css/jcarousel.css" rel="stylesheet" />
<link href="css/flexslider.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet" />
<!-- Theme skin -->
<link href="skins/default.css" rel="stylesheet" />
<!-- Fav and touch icons -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="ico/apple-touch-icon-144-precomposed.png" />
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="ico/apple-touch-icon-114-precomposed.png" />
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="ico/apple-touch-icon-72-precomposed.png" />
<link rel="apple-touch-icon-precomposed" href="ico/apple-touch-icon-57-precomposed.png" />
<link rel="shortcut icon" href="ico/favicon.png" />
</environment>
</head>
<body>
<div id="wrapper">
<header>
<div class="container ">
<!-- end toggle link -->
<div class="row nomargin">
<div class="span12">
<div class="headnav">
<ul>
<li><a asp-area="" asp-controller="Home" asp-action="Registreer"><i class="icon-user"></i>Registreer</a></li>
<li><a asp-area="" asp-controller="Home" asp-action="Login" data-toggle="modal">Inloggen</a></li>
</ul>
</div>
</div>
</div>
<div class="row">
<div class="span2">
<div class="logo">
<a asp-area="" asp-controller="Home" asp-action="Index"><img src="img/logo_kraan.jpg" alt="" class="logo" /></a>
</div>
</div>
<div class="span10">
<div class="navbar navbar-static-top ">
<div class="navigation">
<nav>
<ul class="nav topnav">
<li class="">
<a asp-area="" asp-controller="Home" asp-action="Index">Home</i></a>
</li>
<li>
<a asp-area="" asp-controller="Home" asp-action="Statuten">Statuten</a>
</li>
<li>
<a asp-area="" asp-controller="Home" asp-action="Bestuur">Raad van bestuur</a>
</li>
<li>
<a asp-area="" asp-controller="Home" asp-action="Seminaries">Seminaries</a>
</li>
<li>
<a asp-area="" asp-controller="Home" asp-action="ESCL">Over ESCL</a>
</li>
<li class="dropdown">
Opdrachten <i class="icon-angle-down"></i>
<ul class="dropdown-menu bold">
<li><a asp-area="" asp-controller="Home" asp-action="OverheidsOpdrachten">OverheidsOpdrachten</a></li>
<li><a asp-area="" asp-controller="Home" asp-action="PrivateOpdrachten">Private Opdrachten</a></li>
</ul>
</li>
<li>
<a asp-area="" asp-controller="Home" asp-action="Forum">forum</a>
</li>
<li>
<a asp-area="" asp-controller="Home" asp-action="Contact">Contact </a>
</li>
</ul>
</nav>
</div>
<!-- end navigation -->
</div>
</div>
</div>
</div>
</header>
</div>
<partial name="_CookieConsentPartial" />
<div class="container body-content">
#RenderBody()
<hr />
</div>
<environment include="Development">
<script src="js/jquery.js"></script>
<script src="js/jquery.easing.1.3.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/jcarousel/jquery.jcarousel.min.js"></script>
<script src="js/jquery.fancybox.pack.js"></script>
<script src="js/jquery.fancybox-media.js"></script>
<script src="js/google-code-prettify/prettify.js"></script>
<script src="js/portfolio/jquery.quicksand.js"></script>
<script src="js/portfolio/setting.js"></script>
<script src="js/jquery.flexslider.js"></script>
<script src="js/jquery.nivo.slider.js"></script>
<script src="js/modernizr.custom.js"></script>
<script src="js/jquery.ba-cond.min.js"></script>
<script src="js/jquery.slitslider.js"></script>
<script src="js/animate.js"></script>
<!-- Template Custom JavaScript File -->
<script src="js/custom.js"></script>
</environment>
<environment exclude="Development">
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"
asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
asp-fallback-test="window.jQuery"
crossorigin="anonymous"
integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT">
</script>
<script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/bootstrap.min.js"
asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.min.js"
asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal"
crossorigin="anonymous"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa">
</script>
<script src="~/js/site.min.js" asp-append-version="true"></script>
</environment>
#RenderSection("Scripts", required: false)
</body>
<footer>
<div class="container">
<div class="row">
<div class="span4">
<div class="widget">
<h5 class="widgetheading">Browse pages</h5>
<ul class="link-list">
<li>About our company</li>
<li>Our services</li>
<li>Meet our team</li>
<li>Explore our portfolio</li>
<li>Get in touch with us</li>
</ul>
</div>
</div>
<div class="span4">
<div class="widget">
<h5 class="widgetheading">Important stuff</h5>
<ul class="link-list">
<li>Press release</li>
<li>Terms and conditions</li>
<li>Privacy policy</li>
<li>Career center</li>
<li>Flattern forum</li>
</ul>
</div>
</div>
<div class="span4">
<div class="widget">
<h5 class="widgetheading">Get in touch with us</h5>
<address>
<strong>Flattern studio, Pte Ltd</strong><br>
Springville center X264, Park Ave S.01<br>
Semarang 16425 Indonesia
</address>
<p>
<i class="icon-phone"></i> (123) 456-7890 - (123) 555-7891 <br>
<i class="icon-envelope-alt"></i> email#domainname.com
</p>
</div>
</div>
</div>
</div>
<div id="sub-footer">
<div class="container">
<div class="row">
<div class="span6">
<div class="copyright">
<p>
<span>©BVBR-ABDC</span>
</p>
</div>
</div>
<div class="span6">
<ul class="social-network">
<li><i class="icon-facebook icon-square"></i></li>
<li><i class="icon-twitter icon-square"></i></li>
<li><i class="icon-linkedin icon-square"></i></li>
<li><i class="icon-pinterest icon-square"></i></li>
<li><i class="icon-google-plus icon-square"></i></li>
</ul>
</div>
</div>
</div>
</div>
</footer>
</html>
Bootstrap template:
https://bootstrapmade.com/flattern-multipurpose-bootstrap-template/
All the file references you use in this sample are relative to the page path, so the files need to be there. Since ASP.net will start the default "home" page at (for instance) at http://localhost:33333/ the browser will request that url + css/filename.css and this will work for the first page.
Although if you navigate to http://localhost:33333/Home/Index (which is essentially the same page) it won't work anymore, because the browser will request the css at url + /home/index relative path + css/filename.css (resulting in not finding http://localhost:333333/home/css/filename.css )
You can resolve this quite easily by altering your layout.cshtml from this:
<link href="css/bootstrap.css" rel="stylesheet" />
<link href="css/bootstrap-responsive.css" rel="stylesheet" />
to this:
<link href="/css/bootstrap.css" rel="stylesheet" />
<link href="/css/bootstrap-responsive.css" rel="stylesheet" />
<!-- ^ --->
as you can see there is an added slash (/) before the file path. This will instruct the browser to always use the root of the url and not a relative path to the current location.
I originally had a vs2015 project and I decided to change the theme to bootstraps bootswatch theme superhero. I presumed it was simple enough as I've done this before, usually a case of replacing four files, being two bootstrap css files and two bootstrap js files, once I replaced these it broke my drop-down navigation menu.
So what I've done now is completely started a new project using vs2017, it's an C# MVC app, like the template-style one Microsoft gives you, it has the standard-ish looking theme. Now all I want to do is start by introducing the theme from bootswatch, so I replace the four files like I have done in the past and low n behold I'm still getting the same issue, the menu on the drop-down doesn't work. I have shown a screenshot below:
I can't be the only one who has experienced this, I must still be needing to import some files somewhere, if anyone can list the steps they have taken to get it working that would really help. I would post code but to be honest there is no point at this stage as I’m not making any changes to the app code per-say I’m just wanting to use a new bootstrap theme. Shall include the template code anyway below:
_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">
<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")
#RenderSection("scripts", required: false)
</body>
</html>
Edit: So in the end I've decided I'm going to use a different theme, if anyone ever gets this working would love to know. I checked out the tutorial below, it is the same theme with code provided though if you down this code it still doesn't work! The menu will dropdown but doesn't look the same as it does on bootswatch
https://social.technet.microsoft.com/wiki/contents/articles/37157.customizing-asp-net-mvc-bootstrap-templates.aspx
Try this
<!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><nav class="navbar navbar-expand-lg navbar-dark bg-primary">
#Html.ActionLink("Application name", "Index", "Home", null, new { #class = "navbar-brand" })
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarColor01" aria-controls="navbarColor01" aria-expanded="false" aria-label="Toggle navigation" style="">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarColor01">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="text" placeholder="Search">
<button class="btn btn-secondary my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
<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>
If you notice the toggle on the button of class navbar-toggler is associated with the data-target
You can also place other #Html.Actionlinks in place of the <a> tags
The question is in regard of Bootstrap Image Gallery
blueimp.github.io/Gallery
With the extention
Bootstrap-Image-Gallery
Now to the Question: Why is it that my code doesnt show the Image-Gallery, it does show it as a gallery
The Code
Gallery View
#{
ViewBag.Title = "Gallery";
}
<h2>#ViewBag.Title.</h2>
<!-- The Bootstrap Image Gallery lightbox, should be a child element of the document body -->
<div id="blueimp-gallery" class="blueimp-gallery blueimp-gallery-controls">
<!-- The container for the modal slides -->
<div class="slides"></div>
<!-- Controls for the borderless lightbox -->
<h3 class="title"></h3>
<a class="prev">‹</a>
<a class="next">›</a>
<a class="close">×</a>
<a class="play-pause"></a>
<ol class="indicator"></ol>
<!-- The modal dialog, which will be used to wrap the lightbox content -->
<div class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" aria-hidden="true">×</button>
<h4 class="modal-title"></h4>
</div>
<div class="modal-body next"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left prev">
<i class="glyphicon glyphicon-chevron-left"></i>
Previous
</button>
<button type="button" class="btn btn-primary next">
Next
<i class="glyphicon glyphicon-chevron-right"></i>
</button>
</div>
</div>
</div>
</div>
</div>
<div id="links">
<a href="~/Pictures/12.jpg" title="CityPicture" data-gallery>
<img src="~/Pictures/12.jpg" width="100"/>
</a>
<a href="~/Pictures/694x297_uluru_australia.jpg" title="CityStreet" data-gallery>
<img src="~/Pictures/694x297_uluru_australia.jpg" width="100" />
</a>
<a href="~/Pictures/ausmap.jpg" title="WaterSpring" data-gallery>
<img src="~/Pictures/ausmap.jpg" width="100" />
</a>
</div>
The Code _Layout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title - Australia</title>
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
#Scripts.Render("~/bundles/jquery")
</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("Australia", "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("Gallery", "Gallery", "Home")</li>
<li>#Html.ActionLink("MapLocation", "MapLocation", "Home")</li>
</ul>
#*#Html.Partial("_LoginPartial")*#
</div>
</div>
</div>
<div class="container body-content">
#RenderBody()
#RenderSection("Scripts", required: false)
<hr />
<footer>
<p>© #DateTime.Now.Year - Jesper Kiel Jensen</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#*#Scripts.Render("~/bundles/bootstrap")*#
#Scripts.Render("~/bundles/googlemaps")
#Scripts.Render("~/bundles/bootstrap")
#*#Scripts.Render("~bundles/boostrapGallery")*#
#RenderSection("scripts", required: false)
</body>
</html>
The Code Bundles
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
"~/Scripts/bootstrap.js",
/blueimp-gallery.min.js",
/bootstrap-image-gallery.js",
/respond.js"));
bundles.Add(new StyleBundle("~/Content/css").Include(I was unsure of how much code, I was to ctrl+v , so here is all of it.
This is what I get http://imgur.com/jBHHgKc
This is what I want http://blueimp.github.io/Bootstrap-Image-Gallery/
Hope you understand my question :)
/bootstrap.css",
/site.css",
/blueimp-gallery.min.css",
/bootstrap-image-gallery.css"));
I know it is too late to answer, you missed some CSS files, for complete list of css files and JavaScript files see my article
Image gallery in asp.net mvc with multiple file and size
// CSS files
<link rel="stylesheet"
href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet"
href="//blueimp.github.io/Gallery/css/blueimp-gallery.min.css">
<link rel="stylesheet" href="~/Content/bootstrap-image-gallery.min.css">
// JavaScript files
#Scripts.Render("~/bundles/jquery")
<script src="//blueimp.github.io/Gallery/js/jquery.blueimp-gallery.min.js"></script>
<script src="~/Scripts/bootstrap-image-gallery.min.js"></script>
I have placed a bootstrap navbar in a .net masterpage. This code runs perfectly when on another page without the masterpage, but if on the masterpage, it does not work.
<link href="../plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="../plugins/bootstrap/css/bootstrap-theme.min.css" rel="stylesheet" type="text/css" />
<link href="../plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="../plugins/pnotify/css/jquery.pnotify.default.icons.css" rel="stylesheet"
type="text/css" />
<script src="../plugins/jquery/jquery-1.10.2.min.js" type="text/javascript"></script>
<script src="../plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.1.15/jquery.form-validator.min.js"
type="text/javascript"></script>
<script src="../plugins/notify/notify.min.js" type="text/javascript"></script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<!-- Fixed navbar -->
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="#">XX</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active">Home</li>
<li>About</li>
<li>FAQ</li>
<li class="dropdown">
Dropdown <b class="caret"></b>
<ul class="dropdown-menu">
<li>Action</li>
<li>Another action</li>
<li>Something else here</li>
<li class="divider"></li>
<li>Separated link</li>
<li class="divider"></li>
<li>One more separated link</li>
</ul>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>Default</li>
<li>Log Out</li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
</div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
Anyone? About to throw my computer out the window.
/Bob
if you check your browser inspection tool, I think you may be having this error:
Error("Bootstrap requires jQuery")
Bootstrap.js has a jQuery dependency. So you need to load the jQuery first script before bootstrap.js.
this should be the order. right above the </body> tab. The path should be relative to where you have placed your file.
NOTE: use /parent_folder/..path_to_your_files
<script src="/Scripts/jquery-1.9.0.js" type="text/javascript"></script>
<script src="/Scripts/bootstrap.js" type="text/javascript"></script>
Hope this helps. :-)