Laravel Blade template on c9 is only selectively extending to certain pages - php

My blade template is extending to the index.blade.php with no problem, but doesn't extend to create.blade.php at all which is located in the subfolder. It simply displays the "Create Users" and nothing else. I'm currently using Laravel 5.2 and PHP 5.5.
Following is my admin.blade.php which is the layout template:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Admin</title>
<!-- Bootstrap Core CSS -->
<link href="/css/app.css" rel="stylesheet" type="text/css">
<link href="/css/libs.css" rel="stylesheet" type="text/css">
<!--<link rel="stylesheet" href="{{ URL::asset('/css/app.css') }}">-->
<!--<link rel="stylesheet" href="{{ URL::asset('/css/libs.css') }}">-->
<!--<link rel="stylesheet" href="{{ URL::asset('/css/bootstrap.css') }}">-->
<!--<link href="{{asset('css/app.css')}}" rel="stylesheet">-->
<!--<link href="{{asset('css/libs.css')}}" rel="stylesheet">-->
<!--<link href="/css/blog-post.css" rel="stylesheet" type="text/css">-->
<!--<link href="/css/bootstrap.css" rel="stylesheet" type="text/css">-->
<!--<link href="/css/bootstrap.min.css" rel="stylesheet" type="text/css">-->
<!--<link href="/css/font-awesome.css" rel="stylesheet" type="text/css">-->
<!--<link href="/css/metisMenu.css" rel="stylesheet" type="text/css">-->
<!--<link href="/css/sb-admin-2.css" rel="stylesheet" type="text/css">-->
<!--<link href="/css/styles.css" rel="stylesheet" type="text/css">-->
<!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/css/bootstrap.css">-->
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body id="admin-page">
<div id="wrapper">
<!-- Navigation -->
<nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">Home</a>
</div>
<!-- /.navbar-header -->
<ul class="nav navbar-top-links navbar-right">
<!-- /.dropdown -->
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
<i class="fa fa-user fa-fw"></i> <i class="fa fa-caret-down"></i>
</a>
<ul class="dropdown-menu dropdown-user">
<li><i class="fa fa-user fa-fw"></i> User Profile
</li>
<li><i class="fa fa-gear fa-fw"></i> Settings
</li>
<li class="divider"></li>
<li><i class="fa fa-sign-out fa-fw"></i> Logout
</li>
</ul>
<!-- /.dropdown-user -->
</li>
<!-- /.dropdown -->
</ul>
{{--<ul class="nav navbar-nav navbar-right">--}}
{{--#if(auth()->guest())--}}
{{--#if(!Request::is('auth/login'))--}}
{{--<li>Login</li>--}}
{{--#endif--}}
{{--#if(!Request::is('auth/register'))--}}
{{--<li>Register</li>--}}
{{--#endif--}}
{{--#else--}}
{{--<li class="dropdown">--}}
{{--{{ auth()->user()->name }} <span class="caret"></span>--}}
{{--<ul class="dropdown-menu" role="menu">--}}
{{--<li>Logout</li>--}}
{{--<li>Profile</li>--}}
{{--</ul>--}}
{{--</li>--}}
{{--#endif--}}
{{--</ul>--}}
<div class="navbar-default sidebar" role="navigation">
<div class="sidebar-nav navbar-collapse">
<ul class="nav" id="side-menu">
<li class="sidebar-search">
<div class="input-group custom-search-form">
<input type="text" class="form-control" placeholder="Search...">
<span class="input-group-btn">
<button class="btn btn-default" type="button">
<i class="fa fa-search"></i>
</button>
</span>
</div>
<!-- /input-group -->
</li>
<li>
<i class="fa fa-dashboard fa-fw"></i> Dashboard
</li>
<li>
<i class="fa fa-wrench fa-fw"></i>Users<span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>
All Users
</li>
<li>
Create User
</li>
</ul>
<!-- /.nav-second-level -->
</li>
<li>
<i class="fa fa-wrench fa-fw"></i> Posts<span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>
All Posts
</li>
<li>
Create Post
</li>
</ul>
<!-- /.nav-second-level -->
</li>
<li>
<i class="fa fa-wrench fa-fw"></i>Categories<span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>
All Categories
</li>
<li>
Create Category
</li>
</ul>
<!-- /.nav-second-level -->
</li>
<li>
<i class="fa fa-wrench fa-fw"></i>Media<span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>
All Media
</li>
<li>
Upload Media
</li>
</ul>
<!-- /.nav-second-level -->
</li>
<li>
<i class="fa fa-bar-chart-o fa-fw"></i> Charts<span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>
Flot Charts
</li>
<li>
Morris.js Charts
</li>
</ul>
<!-- /.nav-second-level -->
</li>
<li>
<i class="fa fa-table fa-fw"></i> Tables
</li>
<li>
<i class="fa fa-edit fa-fw"></i> Forms
</li>
<li>
<i class="fa fa-wrench fa-fw"></i> UI Elements<span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>
Panels and Wells
</li>
<li>
Buttons
</li>
<li>
Notifications
</li>
<li>
Typography
</li>
<li>
Icons
</li>
<li>
Grid
</li>
</ul>
<!-- /.nav-second-level -->
</li>
<li>
<i class="fa fa-sitemap fa-fw"></i> Multi-Level Dropdown<span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>
Second Level Item
</li>
<li>
Second Level Item
</li>
<li>
Third Level <span class="fa arrow"></span>
<ul class="nav nav-third-level">
<li>
Third Level Item
</li>
<li>
Third Level Item
</li>
<li>
Third Level Item
</li>
<li>
Third Level Item
</li>
</ul>
<!-- /.nav-third-level -->
</li>
</ul>
<!-- /.nav-second-level -->
</li>
<li class="active">
<i class="fa fa-files-o fa-fw"></i> Sample Pages<span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>
<a class="active" href="blank.html">Blank Page</a>
</li>
<li>
Login Page
</li>
</ul>
<!-- /.nav-second-level -->
</li>
</ul>
</div>
<!-- /.sidebar-collapse -->
</div>
<!-- /.navbar-static-side -->
</nav>
<div class="navbar-default sidebar" role="navigation">
<div class="sidebar-nav navbar-collapse">
<ul class="nav" id="side-menu">
<li>
<i class="fa fa-dashboard fa-fw"></i>Profile
</li>
<li>
<i class="fa fa-wrench fa-fw"></i> Posts<span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>
All Posts
</li>
<li>
Create Post
</li>
</ul>
<!-- /.nav-second-level -->
</li>
</ul>
</div>
</div>
</div>
<!-- Page Content -->
<div id="page-wrapper">
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<h1 class="page-header"></h1>
#yield('content')
</div>
<!-- /.col-lg-12 -->
</div>
<!-- /.row -->
</div>
<!-- /.container-fluid -->
</div>
<!-- /#page-wrapper -->
</div>
<!-- /#wrapper -->
<!-- jQuery -->
<script src="/js/jquery.js"></script>
<script src="/js/libs.js"></script>
<script src="/js/bootstrap.js"></script>
<script src="/js/scripts.js"></script>
<script src="/js/sb-admin-2.js"></script>
<script src="/js/metisMenu.js"></script>
<!--<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>-->
<!--<script src="https://code.jquery.com/jquery-1.12.4.js" integrity="sha256-Qw82+bXyGq6MydymqBxNPYTaUXXq7c8v3CwiYwLLNXU=" crossorigin="anonymous"></script>-->
#yield('footer')
</body>
</html>
Following is my create.blade.php:
#extends('layouts.admin')
#section('content')
<h1>Create Users</h1>
#stop
Following is my AdminUsersController:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests;
use App\User;
class AdminUsersController extends Controller
{
/**
* Display a listing of the resource.
*
* #return \Illuminate\Http\Response
*/
public function index()
{
$users = User::all();
return view('admin.users.index', compact('users'));
}
/**
* Show the form for creating a new resource.
*
* #return \Illuminate\Http\Response
*/
public function create()
{
return view('admin.users.create');
}
/**
* Store a newly created resource in storage.
*
* #param \Illuminate\Http\Request $request
* #return \Illuminate\Http\Response
*/
public function store(Request $request)
{
//
}
/**
* Display the specified resource.
*
* #param int $id
* #return \Illuminate\Http\Response
*/
public function show($id)
{
return view('admin.users.show');
}
/**
* Show the form for editing the specified resource.
*
* #param int $id
* #return \Illuminate\Http\Response
*/
public function edit($id)
{
return view('admin.users.edit');
}
/**
* Update the specified resource in storage.
*
* #param \Illuminate\Http\Request $request
* #param int $id
* #return \Illuminate\Http\Response
*/
public function update(Request $request, $id)
{
//
}
/**
* Remove the specified resource from storage.
*
* #param int $id
* #return \Illuminate\Http\Response
*/
public function destroy($id)
{
//
}
}
And finally my route:
Route::resource('admin/users', 'AdminUsersController');`
Following is the picture of my file structure
Thank you in advance.


#extends('path_to_index.blade.php') will fix your problem if create.blade.php extends index.blade.php. If create.blade.php extends main.blade.php and index.blade.php extends create.blade.php then you should extend index.blade.php.

Related

Browser disabled after logout in codeigniter

The admin controller I have:
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Admin extends CI_controller{
public function __construct(){
parent::__construct();
$this->load->model('common');
$this->load->library('session');
}
public function index(){
$this->load->view("login");
}
public function matched(){
$this->form_validation->set_rules('name','Name','required');
$this->form_validation->set_rules('pass','Password','required');
if($this->form_validation->run()==FALSE){
$error['error']=validation_errors();
$this->load->view('login',$error);
}
else{
$name= $this->input->post('name');
$pass=$this->input->post('pass');
$result=$this->common->match_data($name,$pass);
if(!empty($result)){
$data=array(
'id'=>$result[0]->id,
'name'=>$result[0]->name,
'type'=>$result[0]->type,
'logged_in'=>TRUE
);
$this->session->set_userdata($data);
redirect('dashboard');
}
else{
$this->load->view('login');
}
}
}
public function logoutuser(){
$this->session->sess_destroy();
redirect("admin","refresh");
}
}
?>
Dashboard Controller :
<?php
class Dashboard extends CI_controller{
public function __construct(){
parent::__construct();
$this->load->model('common');
}
public function index(){
$this->load->view('dashboard');
}
}
?>
Dashboard page or view page:
<?php
//echo "<pre>";print_r($this->session->all_userdata());exit;
$name=$this->session->userdata('name');
$id=$this->session->userdata('id');
$type=$this->session->userdata('type');
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>SB Admin - Bootstrap Admin Template</title>
<!-- Bootstrap Core CSS -->
<link href="<?php echo base_url();?>assets/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="<?php echo base_url();?>assets/css/sb-admin.css" rel="stylesheet">
<!-- Morris Charts CSS -->
<link href="<?php echo base_url();?>assets/css/plugins/morris.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="<?php echo base_url();?>assets/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div id="wrapper">
<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href=""><?php echo "User"."-".ucwords($type); ?></a>
</div>
<!-- Top Menu Items -->
<ul class="nav navbar-right top-nav">
<li class="dropdown">
<i class="fa fa-envelope"></i> <b class="caret"></b>
<ul class="dropdown-menu message-dropdown">
<li class="message-preview">
<a href="#">
<div class="media">
<span class="pull-left">
<img class="media-object" src="http://placehold.it/50x50" alt="">
</span>
<div class="media-body">
<h5 class="media-heading"><strong><?php echo $name;?></strong>
</h5>
<p class="small text-muted"><i class="fa fa-clock-o"></i> Yesterday at 4:32 PM</p>
<p>Lorem ipsum dolor sit amet, consectetur...</p>
</div>
</div>
</a>
</li>
<li class="message-preview">
<a href="#">
<div class="media">
<span class="pull-left">
<img class="media-object" src="http://placehold.it/50x50" alt="">
</span>
<div class="media-body">
<h5 class="media-heading"><strong><?php echo $name;?></strong>
</h5>
<p class="small text-muted"><i class="fa fa-clock-o"></i> Yesterday at 4:32 PM</p>
<p>Lorem ipsum dolor sit amet, consectetur...</p>
</div>
</div>
</a>
</li>
<li class="message-preview">
<a href="#">
<div class="media">
<span class="pull-left">
<img class="media-object" src="http://placehold.it/50x50" alt="">
</span>
<div class="media-body">
<h5 class="media-heading"><strong><?php echo $name;?></strong>
</h5>
<p class="small text-muted"><i class="fa fa-clock-o"></i> Yesterday at 4:32 PM</p>
<p>Lorem ipsum dolor sit amet, consectetur...</p>
</div>
</div>
</a>
</li>
<li class="message-footer">
Read All New Messages
</li>
</ul>
</li>
<li class="dropdown">
<i class="fa fa-bell"></i> <b class="caret"></b>
<ul class="dropdown-menu alert-dropdown">
<li>
Alert Name <span class="label label-default">Alert Badge</span>
</li>
<li>
Alert Name <span class="label label-primary">Alert Badge</span>
</li>
<li>
Alert Name <span class="label label-success">Alert Badge</span>
</li>
<li>
Alert Name <span class="label label-info">Alert Badge</span>
</li>
<li>
Alert Name <span class="label label-warning">Alert Badge</span>
</li>
<li>
Alert Name <span class="label label-danger">Alert Badge</span>
</li>
<li class="divider"></li>
<li>
View All
</li>
</ul>
</li>
<li class="dropdown">
<i class="fa fa-user"></i> <?php echo $name;?><b class="caret"></b>
<ul class="dropdown-menu">
<li>
<i class="fa fa-fw fa-user"></i> Profile
</li>
<li>
<i class="fa fa-fw fa-envelope"></i> Inbox
</li>
<li>
<i class="fa fa-fw fa-gear"></i> Settings
</li>
<li class="divider"></li>
<li>
<i class="fa fa-fw fa-power-off"></i> Log Out
</li>
</ul>
</li>
</ul>
<!-- Sidebar Menu Items - These collapse to the responsive navigation menu on small screens -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav side-nav">
<li class="active">
<i class="fa fa-fw fa-dashboard"></i> Dashboard
</li>
<li>
<i class="fa fa-fw fa-bar-chart-o"></i> Charts
</li>
<li>
<i class="fa fa-fw fa-table"></i> Tables
</li>
<li>
<i class="fa fa-fw fa-edit"></i> Forms
</li>
<li>
<i class="fa fa-fw fa-desktop"></i> Bootstrap Elements
</li>
<li>
<i class="fa fa-fw fa-wrench"></i> Bootstrap Grid
</li>
<li>
<i class="fa fa-fw fa-arrows-v"></i> Dropdown <i class="fa fa-fw fa-caret-down"></i>
<ul id="demo" class="collapse">
<li>
Dropdown Item
</li>
<li>
Dropdown Item
</li>
</ul>
</li>
<li>
<i class="fa fa-fw fa-file"></i> Blank Page
</li>
<li>
<i class="fa fa-fw fa-dashboard"></i> RTL Dashboard
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</nav>
<div id="page-wrapper">
<div class="container-fluid">
<!-- Page Heading -->
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">
Dashboard <small>Statistics Overview</small>
</h1>
<ol class="breadcrumb">
<li class="active">
<i class="fa fa-dashboard"></i> Dashboard
</li>
</ol>
</div>
</div>
<!-- /.row -->
<!-- /.row -->
</div>
<!-- /.container-fluid -->
</div>
<!-- /#page-wrapper -->
</div>
<!-- /#wrapper -->
<!-- jQuery -->
<script src="<?php echo base_url();?>assets/js/jquery.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="<?php echo base_url();?>assets/js/bootstrap.min.js"></script>
<!-- Morris Charts JavaScript -->
<script src="<?php echo base_url();?>assets/js/plugins/morris/raphael.min.js"></script>
<script src="<?php echo base_url();?>assets/js/plugins/morris/morris.min.js"></script>
<script src="<?php echo base_url();?>assets/js/plugins/morris/morris-data.js"></script>
</body>
</html>
problem is that when i am clicking on the browser back button its take me back on logged in user ..ever time i need to disable browser back button using codeigniter without using javascript

You need to check session in your controller
<?php
class Dashboard extends CI_controller{
public function __construct(){
parent::__construct();
$this->load->model('common');
$this->load->library('session');
}
public function index(){
if($this->session->all_userdata()){
$this->load->view('dashboard');
}
else{
redirect('lofin_contoller');
}
}
}
?>

Disabling back button of browser is not possible in codeigniter.
While there is alternative ways of Redirecting user upon destroying session to that page which we want.
check session variable in your view,controller is it working..
echo $_SESSION['session_varibalename'];
Also you can see this link too: how to disable the back button in codeigniter?
<?php
class Dashboard extends CI_controller{
public function __construct(){
parent::__construct();
$this->load->model('common');
$this->load->library('session');
}
public function index(){
$logged_in = $this->session->userdata('logged_in');
if($logged_in == TRUE || empty($logged_in))
{
//user not logged in
$this->session->set_flashdata('error', 'Session has Expired');
//it will redirect the user to the Admin controller to index function which will call the login view.
redirect('Admin/index');
}
else
{
//user Logged in
$this->load->view('dashboard');
}
}
}

Anchor links not working when I used it in include files in php

Im using include 'header.php' so i'll not repeat my header code all over again but I noticed it that the links inside the header.php are not working except the parent file the dashboard.php.
ALl the anchor tags inside the dashboard.php are working but not inside the header.php
This is my dashboard.php code
<?php require_once 'includes/header.php'; ?>
<!-- Setting the treeview active -->
<script type="text/javascript">
document.getElementById("treeview1").className = "active menu-open"
</script>
<!-- End Setting the treeview active -->
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Dashboard
<small>Version 2.0</small>
</h1>
<ol class="breadcrumb">
<li><i class="fa fa-dashboard"></i> Home</li>
<li><i class="fa fa-dashboard"></i> Question</li>
<li class="active">Dashboard</li>
</ol>
</section>
<!-- Main content -->
<section class="content">
</section>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
<?php require_once 'includes/footer.php'; ?>
Heres the header.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>SOG Evaluation System</title>
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Bootstrap 3.3.7 -->
<link rel="stylesheet" href="../assets/bower_components/bootstrap/dist/css/bootstrap.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="../assets/bower_components/font-awesome/css/font-awesome.min.css">
<!-- Ionicons -->
<link rel="stylesheet" href="../assets/bower_components/Ionicons/css/ionicons.min.css">
<!-- Theme style -->
<link rel="stylesheet" href="../assets/dist/css/AdminLTE.min.css">
<!-- AdminLTE Skins. Choose a skin from the css/skins
folder instead of downloading all of them to reduce the load. -->
<link rel="stylesheet" href="../assets/dist/css/skins/skin-green.css">
<!-- CLOCK rico -->
<script src="../assets/plugins/clock/ricoClock.js"></script>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="hold-transition sidebar-mini skin-green"> <!-- set dito yung name ng theme -->
<div class="wrapper">
<header class="main-header">
<!-- Logo -->
<a href="dashboard.php" class="logo">
<!-- mini logo for sidebar mini 50x50 pixels -->
<span class="logo-mini"><b>SOG</b></span>
<!-- logo for regular state and mobile devices -->
<span class="logo-lg">SOG Evaluation System</span>
</a>
<!-- Header Navbar: style can be found in header.less -->
<nav class="navbar navbar-static-top">
<!-- Sidebar toggle button-->
<a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
<span class="sr-only">Toggle navigation</span>
</a>
<!-- Navbar Right Menu -->
<div class="navbar-custom-menu">
<ul class="nav navbar-nav">
<!-- Messages: style can be found in dropdown.less-->
<li class="dropdown messages-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-envelope-o"></i>
<span class="label label-success">4</span>
</a>
<ul class="dropdown-menu">
<li class="header">You have 4 messages</li>
<li>
<!-- inner menu: contains the actual data -->
<ul class="menu">
<li><!-- start message -->
<a href="#">
<div class="pull-left">
<img src="../assets/dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
</div>
<h4>
Support Team
<small><i class="fa fa-clock-o"></i> 5 mins</small>
</h4>
<p>Why not buy a new awesome theme?</p>
</a>
</li>
<!-- end message -->
<li>
<a href="#">
<div class="pull-left">
<img src="../assets/dist/img/user3-128x128.jpg" class="img-circle" alt="User Image">
</div>
<h4>
AdminLTE Design Team
<small><i class="fa fa-clock-o"></i> 2 hours</small>
</h4>
<p>Why not buy a new awesome theme?</p>
</a>
</li>
<li>
<a href="#">
<div class="pull-left">
<img src="../assets/dist/img/user4-128x128.jpg" class="img-circle" alt="User Image">
</div>
<h4>
Developers
<small><i class="fa fa-clock-o"></i> Today</small>
</h4>
<p>Why not buy a new awesome theme?</p>
</a>
</li>
<li>
<a href="#">
<div class="pull-left">
<img src="../assets/dist/img/user3-128x128.jpg" class="img-circle" alt="User Image">
</div>
<h4>
Sales Department
<small><i class="fa fa-clock-o"></i> Yesterday</small>
</h4>
<p>Why not buy a new awesome theme?</p>
</a>
</li>
<li>
<a href="#">
<div class="pull-left">
<img src="../assets/dist/img/user4-128x128.jpg" class="img-circle" alt="User Image">
</div>
<h4>
Reviewers
<small><i class="fa fa-clock-o"></i> 2 days</small>
</h4>
<p>Why not buy a new awesome theme?</p>
</a>
</li>
</ul>
</li>
<li class="footer">See All Messages</li>
</ul>
</li>
<!-- Notifications: style can be found in dropdown.less -->
<li class="dropdown notifications-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-bell-o"></i>
<span class="label label-warning">10</span>
</a>
<ul class="dropdown-menu">
<li class="header">You have 10 notifications</li>
<li>
<!-- inner menu: contains the actual data -->
<ul class="menu">
<li>
<a href="#">
<i class="fa fa-users text-aqua"></i> 5 new members joined today
</a>
</li>
<li>
<a href="#">
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the
page and may cause design problems
</a>
</li>
<li>
<a href="#">
<i class="fa fa-users text-red"></i> 5 new members joined
</a>
</li>
<li>
<a href="#">
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
</a>
</li>
<li>
<a href="#">
<i class="fa fa-user text-red"></i> You changed your username
</a>
</li>
</ul>
</li>
<li class="footer">View all</li>
</ul>
</li>
<!-- User Account: style can be found in dropdown.less -->
<li class="dropdown user user-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<img src="../assets/dist/img/avatar.png" class="user-image" alt="User Image">
<span class="hidden-xs">Superadmin</span>
</a>
<ul class="dropdown-menu">
<!-- User image -->
<li class="user-header">
<img src="../assets/dist/img/avatar.png" class="img-circle" alt="User Image">
<p>
Superadmin - Web Developer
<small>Member since Nov. 2012</small>
</p>
</li>
<!-- Menu Body -->
<li class="user-body">
<div class="row">
<div class="col-xs-4 text-center">
Followers
</div>
<div class="col-xs-4 text-center">
Sales
</div>
<div class="col-xs-4 text-center">
Friends
</div>
</div>
<!-- /.row -->
</li>
<!-- Menu Footer-->
<li class="user-footer">
<div class="pull-left">
Profile
</div>
<div class="pull-right">
Sign out
</div>
</li>
</ul>
</li>
<!-- Control Sidebar Toggle Button -->
</ul>
</div>
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->
<div class="user-panel">
<div class="pull-left image">
<img src="../assets/dist/img/avatar.png" class="img-circle" alt="User Image">
</div>
<div class="pull-left info">
<p>Superadmin</p>
<i class="fa fa-circle text-success"></i> Online
</div>
</div>
<!-- search form -->
<!-- <form action="#" method="get" class="sidebar-form">
<div class="input-group">
<input type="text" name="q" class="form-control" placeholder="Search...">
<span class="input-group-btn">
<button type="submit" name="search" id="search-btn" class="btn btn-flat">
<i class="fa fa-search"></i>
</button>
</span>
</div>
</form> -->
<!-- /.search form -->
<div id="clockbox" style="font:12pt ; color:#ffffff;text-align: center;margin-bottom: 7px;padding: 10px"></div>
<!-- sidebar menu: : style can be found in sidebar.less -->
<ul class="sidebar-menu" data-widget="tree">
<li class="header">MAIN NAVIGATION</li>
<li class="treeview" id="treeview1">
<a href="dashboard.php">
<i class="fa fa-dashboard"></i> <span>Dashboard</span>
</a>
</li>
<li class="treeview" id="treeview2">
<a href="manageUsers.php">
<i class="fa fa-user"></i> <span>User Management</span>
</a>
</li>
<li class="treeview" id="treeview3">
<a href="manageQuestions.php">
<i class="fa fa-list-ul"></i> <span>Questionnaire Management</span>
</a>
</li>
<li class="treeview" id="treeview4">
<a href="manageSchedule.php">
<i class="fa fa-calendar"></i> <span>Evaluation Schedule</span>
</a>
</li>
<li class="treeview" id="treeview5">
<a href="viewResults.php">
<i class="fa fa-bar-chart"></i> <span>Evaluation Results</span>
</a>
</li>
<li class="treeview" id="treeview6">
<a href="generateReports.php">
<i class="fa fa-file-text"></i> <span>Reports</span>
</a>
</li>
<li class="treeview" id="treeview7">
<a href="manageSystemSettings.php">
<i class="fa fa-wrench"></i> <span>System Settings</span>
</a>
</li>
<li class="header">LABELS</li>
<li><i class="fa fa-circle-o text-red"></i> <span>Important</span></li>
<li><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></li>
<li><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></li>
</ul>
</section>
<!-- /.sidebar -->
</aside>

All your links are empty. They are all <a href="#".
Then above href will make the browser go to top of page.
The way it should be used is <a href="#about".
And that will make the browser go to the about section (if there is an about id)
See this answer for a complete documentation of how it works.
What is href="#" and why is it used?

Guys I already found the error. The conflict is on my class, the treeview class on my sidebar-menu (header.php). I just removed it and it's working now.

Using PHP include() inside Bootstrap 3 not working

Edited:
I am trying to use PHP include function to call "Navbar Header", "Navigation" and "Footer" section of my Bootstrap code, so that I do not have to make changes to all my HTML files when something changes in any of the above 3.
I am using Bootstrap 3.
Please assist me here, as I am not able to use the PHP functionality with Bootstrap 3. Thanks..
Below is my code:
--> index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Test PHP</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link href="css/styles.css" rel="stylesheet">
</head>
<body>
<?php include("includes/header.html");?>
<?php include("includes/navigation.html");?>
<div class="container-fluid">
<!-- START Page Heading -->
<div id="page-wrapper">
<div class="container-fluid">
<!-- Page Heading -->
<div class="row">
<div class="col-lg-10">
<a><h1 class="page-header">Home </h1></a>
<ol class="breadcrumb">
<li class="active">
<i class="glyphicon glyphicon-home"></i> Home
</li>
</ol>
<div class="container">
<div class="jumbotron text-center">
<h1>Sample Website</h1>
<div class="row">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END Page Heading -->
</div>
</div>
<?php include("includes/footer.html");?>
<!-- Script References -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/scripts.js"></script>
</body>
</html>
1) Navbar Header.html
<div class="container-fluid">
<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>
<a class="navbar-brand" href="#"><strong>Sample Website</strong></a>
</div>
</div>
</div>
2) Navigation.html
<div class="container-fluid">
<div class="row">
<div class="col-sm-2">
<strong><i class="glyphicon glyphicon-home active"></i> HOME</strong>
<hr>
<ul class="nav nav-pills nav-stacked">
<li class="nav-header"></li>
<li><i class="glyphicon glyphicon-cloud"></i><strong> Overview</strong></li>
<li><i class="glyphicon glyphicon-picture"></i><strong> About</strong></li>
</ul>
<div class="clearfix"></div>
<hr>
<a><strong><i class="glyphicon glyphicon-user"></i> VIEW 1 </strong></a>
<hr>
<ul class="nav nav-stacked">
<li><a><i class="glyphicon glyphicon-list-alt"></i><strong> Type</strong></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel" style="display: block; position: static; margin-bottom: 5px; *width: 180px;">
<li class="dropdown-submenu">
<a tabindex="-1">Type1</a>
<ul class="dropdown-menu">
<li>Description</li>
<li class="divider"></li>
<li class="dropdown-submenu">
<!-- <li role="menu" class="dropdown-header">Schema Type</li> -->
<li class="dropdown-submenu">
<a tabindex="-1">Inner view1</a>
<ul class="dropdown-menu">
<li class="dropdown-submenu">
<li>About</li>
<li class="divider"></li>
<li class="dropdown-submenu">
<a tabindex="-1">Detail</a>
<ul class="dropdown-menu">
<li><a tabindex="-1" href="detail1.html">Detail 1</a></li>
<li><a tabindex="-1" href="detail2.html">Detail 2</a></li>
</ul>
</li>
</ul>
</li>
<li class="dropdown-submenu">
<a tabindex="-1">Type2/a>
<ul class="dropdown-menu">
<li class="dropdown-submenu">
<li>Description</li>
<li class="divider"></li>
<li class="dropdown-submenu">
<a tabindex="-1">Inner view 2</a>
<ul class="dropdown-menu">
<li><a tabindex="-1" href="idetail1.html">Detail 1</a></li>
<li><a tabindex="-1" href="idetail2.html">Detail 2</a></li>
</ul>
</li>
</ul>
</ul>
</li>
</ul>
</ul>
<hr>
</div>
</div>
3) Footer.html
<footer class="row">
<div class="container">
<div class="col-lg-4 col-lg-push-4 col-md-4 col-md-push-4 col-sm-4 col-sm-push-4 col-xs-12">
<div class="text-center">
<p>Copyright © 2015 <a href="http://www.banes.com" title="Banes">
<strong>Banes Ltd.</strong></a>
</p>
</div>
</div>
</div>
</footer>

You have too much duplication in your index.file. Code should only exist once. Look at your include lines and imagine the file being 'included' at that point...
Header.html
<html>
<head>
...tags...
</head>
<body>
Index.php
<?php include("includes/header.html");?>
<div class="container-fluid">
...stuff here..
</div>
<?php include("includes/footer.html");?>
Footer.html
<script>...</script>
<script>...</script>
</body>
</html>

You're including a whole page in every file.
The header footer and navigation files should only contain the parts of the html you want to include
So you have 4 head elements each calling in bootstrap.
This is never going to play nicely. Delete all of the tags in the partial files that do not contain markup specific to that page, and have one page with html>head>body structure that includes the parts of the other files

Why is my bootstrap dropdown not working?

Here is the code, I am trying to add a dropdown for login. Here is the header:
<head>
<title>Forms Generator</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<link rel="stylesheet" type="text/css"
href="<?php echo $path . 'css/main.css'; ?>" />
</head>
<body>
<div id="page">
<header class="navbar-inverse" role="banner">
<nav class="navbar navbar-inverse">
<div class="container">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Forms Generator</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active">Home <span class="sr-only">(current)</span></li>
<li class="active">Create Form<span class="sr-only">(current)</span></li>
<li class="active">View Surveys<span class="sr-only">(current)</span></li>
<li class="active">View Statistics<span class="sr-only">(current)</span></li>
</ul>
<!-- Working on dropdown here -->
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
Dropdown <span class="caret"></span>
<ul class="dropdown-menu">
<li>Action</li>
<li>Another action</li>
<li>Something else here</li>
<li role="separator" class="divider"></li>
<li>Separated link</li>
</ul>
</li>
</ul>
<!-- END DROPDOWN WORK-->
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</div>
</nav>
</header>
<p>Interactive Forms Generation</p>
<p>Enter links/buttons to create survey/take survey, etc here.</p>
</div>
</div>
Here's the code for the footer:
<div id="footer">
<p class="copyright">
© <?php echo date("Y"); ?>
</p>
</div>
</div>
</div><!-- end page -->
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>
</html>
So basically the dropdown that I'm attempting to add to the end of the navbar isn't dropping down. Why is it not doing so?
EDIT: I am running XAMPP and using Chrome.

Check your html document at https://validator.w3.org/nu/
Take a look at the (error) console of your browser
try it with
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

just put your jquery file before bootstrap.js file
<script src="script/jquery-3.2.0.js" type="text/javascript"></script>
<script src="script/bootstrap.js" type="text/javascript"></script>

Bootstrap navbar not functioning with php

I'm using php (mamp stack) and bootstrap.
I have bootstrap.js, bootstrap.css, my index.php file all in the same folder.
Yet the bootstrap styling of the navbar is not functioning. Don't know why this is happening. Here is my code:
<!DOCTYPE html>
<html>
<head>
<title>Summit</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/bootstrap.css" rel="stylesheet">
<script src="js/bootstrap.js"></script>
</head>
<body>
<h1>Summit</h1>
<nav class="navbar navbar-default" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Brand</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active">Link</li>
<li>Link</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>
<form class="navbar-form navbar-left" role="search">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
<ul class="nav navbar-nav navbar-right">
<li>Link</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>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</nav>
</body>
</html>

"I have bootstrap.js, bootstrap.css, my index.php file all in the same folder."
In that case change these lines;
<link href="css/bootstrap.css" rel="stylesheet">
<script src="js/bootstrap.js"></script>
to
<link href="bootstrap.css" rel="stylesheet">
<script src="bootstrap.js"></script>

Categories