Error Loading multiple pages in php site

0

I have a PHP site where I have to load several pages. Only once. What is happening is the overlay of screens with several inclusions.

<div class="container">
  <h2>MAPAS</h2>
  <ul class="nav nav-tabs">
    <li><a data-toggle="tab" href="#menu1">Detalhes</a></li>
    <li class="active"><a data-toggle="tab" href="#menu2">Mapas</a></li>
    <li><a data-toggle="tab" href="#menu3">Cadastrar Devices</a></li>
    <li><a data-toggle="tab" href="#menu4">Alerta</a></li>
  </ul>

  <div class="tab-content">

    <div id="menu1" class="tab-pane fadee">
        <?php require_once "paginas/detalhes.php"; ?>
    </div>

    <div id="menu2" class="tab-pane fade in active">
        <?php require_once "paginas/mapas.php"; ?>
    </div>

    <div id="menu3" class="tab-pane fade">
        <?php require_once "paginas/cadastrodivices.php"; ?>
    </div>

    <div id="menu4" class="tab-pane fade">
        <?php require_once "paginas/alerta.php"; ?>
    </div>
  </div>
</div>

Screen Error  

    
asked by anonymous 12.06.2017 / 22:43

1 answer

1

I was able to solve the problem using the jquery Tabs plugin With it tabs load only once each page .php

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title></title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script><scriptsrc="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

  <script>
  $( function() {
    $( "#tabs" ).tabs({
      beforeLoad: function( event, ui ) {
        ui.jqXHR.fail(function() {
          ui.panel.html(
            "Couldn't load this tab. We'll try to fix this as soon as possible. " +
            "If this wouldn't be a demo." );
        });
      }
    });
  } );
  </script>

</head>
<body>

<div id="tabs">
  <ul>
    <li><a href="paginas/detalhes.php">Detalhes</a></li>
    <li><a href="paginas/mapas.php">Mapas</a></li>
    <li><a href="paginas/cadastrodivices.php">Cadastrar Divices</a></li>
    <li><a href="paginas/alerta.php">Alerta</a></li>
  </ul>

</div>


</body>
</html>
    
14.06.2017 / 22:44