HTML Extend layout not working

Question

i`m using layout page called home.blade.php .here is the code.

 <!DOCTYPE html>
<html lang="{{ config('app.locale') }}">

  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Training Management</title>
    <meta name="description" content="Free Bootstrap Theme by BootstrapMade.com">
    <meta name="keywords" content="free website templates, free bootstrap themes, free template, free bootstrap, free website template">

    <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:400,300|Raleway:300,400,900,700italic,700,300,600">
    <link rel="stylesheet" type="text/css" href="css/jquery.bxslider.css">
    <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/animate.css">
    <link rel="stylesheet" type="text/css" href="css/style.css">
    {!! Charts::assets() !!}

  </head>
<body>

<div class="loader"></div>
    <div id="myDiv">
    <!--HEADER-->
    <div class="header">
      <div class="bg-color">
      <header id="main-header">
        <nav class="navbar navbar-default navbar-fixed-top">
          <div class="container">
            <div class="navbar-header">
              <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
              </button>
              <a class="navbar-brand" href="home#">MOB<span class="logo-dec">ITEL</span></a>
            </div>
            <div class="collapse navbar-collapse" id="myNavbar">
              <ul class="nav navbar-nav navbar-right">

                <li class=""><a href="#feature">Trainee Details</a></li>
                <li class=""><a href="#service">User Registration</a></li>
                <li class=""><a href="#portfolio">Downloads</a></li>
                <li class=""><a href="#testimonial">Certificate & Evaluation</a></li>
                <li class=""><a href="#blog">Training Programs</a></li>
                <li class=""><a href="#contact">Contact Us</a></li>

                <ul class="nav navbar-nav navbar-right">
            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                                    {{ Auth::user()->name }} <span class="caret"></span>
                                </a>

                                <ul class="dropdown-menu" role="menu">
                                    <li>
                                        <a href="{{ route('logout') }}"
                                            onclick="event.preventDefault();
                                                     document.getElementById('logout-form').submit();">
                                            Logout
                                        </a>

                                        <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
                                            {{ csrf_field() }}
                                        </form>


                                    </li>
                                </ul>
                            </li>
          </ul>
              </ul>
            </div>
          </div>
        </nav>
        </header>


        <div class="wrapper">
        <div class="container">
          <div class="row">
            <div class="banner-info text-center wow fadeIn delay-05s">
            </div>
          </div>
        </div>
        </div>


 @yield('content') 

    </div>


     <footer id="footer" >
      <div class="container">
        <div class="row text-center">
          <p>&copy; All Rights Reserved.</p>
          <div class="credits">

        </div>
        </div>
      </div>
    </footer>
</div>


</div>

  <script src="js/jquery.min.js"></script>
    <script src="js/jquery.easing.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/wow.js"></script>
    <script src="js/jquery.bxslider.min.js"></script>
    <script src="js/custom.js"></script>
    <script src="contactform/contactform.js"></script>
</body>
</html>

This layout need to use in a web page and it has extend by me but not working.here is the code.

`@extends('layouts.home')

@section('content')

 <div class="panel panel-default">
            <div class="panel-body">
             <div class="col-md-6 col-md-offset-3">
             <table class="table table-bordered">

              <tbody>
                  <tr>
                    <td>Training ID</td>
                  <td>{{ $item['trainee_id'] }}</td>
                  </tr>
                  <tr>
                    <td>Name With Initials</td>
                  <td>{{ $item['trainee_name'] }}</td>
                  </tr>

                     <tr>
                    <td>Download Details</td>
                  <td><a class="btn btn-success" href="BankExport/{{ $item->trainee_id }}">See Here</a></td>
                  </tr>

              </tbody>
             </table> 
             </div>
             </div>
             </div>
 @endsection`

This the screenshot what um getting.

This is the type of design um expexting

Are all of your CSS pages in the right subdirectories? (`css/bootstrap.min.css`) — cosinepenguin, Jun 22 '17 at 15:14
Yes ,some pages work fine but pages which using this type of forms not working as i want — Dasun, Jun 22 '17 at 15:19
In Chrome, go to View > Developer > JavaScript Console, then refresh your page 127.0.0.1:8000/Bankdetails/MOB/TR/1743. Are there any errors logged? — cosinepenguin, Jun 22 '17 at 16:32
this problem comes if 127.0.0.1:8000/Bankdetails/MOB/TR/1743. or 127.0.0.1:8000/Bankdetails/create ,if it is like 127.0.0.1:8000/Bankdetails template works — Dasun, Jun 22 '17 at 16:39

score 1 · Accepted Answer · answered Jun 23 '17 at 04:01

1

put all the css and js under the public directory and then

change all the js and css call like this

<link rel="stylesheet" type="text/css" href="{{ public_path('css/jquery.bxslider.css') }}">

answered Jun 23 '17 at 04:01

Exprator

26,992
6
47
59

bro problem not fixed,problem is like this this problem comes if 127.0.0.1:8000/Bankdetails/MOB/TR/1743. or 127.0.0.1:8000/Bankdetails/create ,if it is like 127.0.0.1:8000/Bankdetails template works – Dasun Jun 23 '17 at 06:29

score 0 · Answer 2 · answered Jun 23 '17 at 15:39

It seems that your "extends" link is not correct, based on what the question says. You say that "i'm using layout page called home.blade.php," yet in your code you extend a page called "layouts.home" (@extends('layouts.home'))!

You might need to make sure you are actually calling @extends('home.blade.php').

If this doesn't work, and since there aren't any errors on other pages, can we see the framework for those pages to compare with this one?

Hope this helps!

if you able to come via a chat? – Dasun Jun 23 '17 at 15:41 — Dasun, Jun 23 '17 at 15:41

HTML Extend layout not working

2 Answers2