Skip to main content
adicionou 713 caracteres ao conteúdo; título editado
Fonte Link
Bruno
  • 1,4mil
  • 12
  • 37

Ao clicar no botão abrir o Manter sempre uma section visível em php

Criei um menu e para as sections quecada um deles criei. Fora das uma sectionssection. Depois do menu criei um form com os inputs para filtrar pelo nomepor colaborar e por data em todas. Depois criei as sections.

<script>
$(function() {
  $(".btn-show").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $("section > div:not("+el+"):visible"el).hideshow();
    $("section > div").not(el).showhide();
  });
  });
</script>
<!DOCTYPE html> 
<html>
<head> 
    <title></title>
<script
  src="https://code.jquery.com/jquery-1.9.1.min.js"
  integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ="
  crossorigin="anonymous"></script> 
<script<div src="https://cdnjs.cloudflare.com/ajax/libs/jquery-maskmoney/3.0.2/jquery.maskMoney.min.js"></script>class="wrapper">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" /> <nav class="vertical">
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
</head> 
<body>

<div class="wrapper">
<nav class="vertical">
    <ul class="men clearfix1">
        <li><a href="#Tarefas Diárias">Tarefas Diárias</a>
            
        </li>
        <li><a href="#Tarefas Semanais">Tarefas Semanais</a>
        <!-- Nível 1 -->
            <!-- submenu -->
            <ul class="sub-men clearfix1">
                <li><a href="#s1" class="btn-show" data-element="#minhaDiv">Gerais Quartos Ala A</a></li>
                <li><a href="#s2"href="#s1" class="btn-show" data-element="#minhaDiv1">Geraiselement="#minhaDiv">Gerais Quartos Ala B<A</a></li>
                <li><a href="#s3" class="btn-show" data-element="#minhaDiv2">Esplanada/Cabeleireiro</a></li>
                <li><a href="#s4"href="#s2" class="btn-show" data-element="#minhaDiv3">Hig. Ind. Copa</a></li>
                <li><a href="#s5" class="btn-show"element="#minhaDiv1">Gerais data-element="#minhaDiv4">Gab.Quartos Enf/Méd/AdminAla (Sábado)</a><B</li>a>
                <li><a href="#s6" class="btn-show" data-element="#minhaDiv5">Gab. Enf/Méd/Admin (Domingo)</a></li>ul>
            </ul><!-- submenu -->
        </li>
        <li><a href="#Tarefas Mensais">Tarefas Mensais</a></li>
        <li><a href="#Tarefas Trimestrais">Tarefas Trimestrais</a></li>
    </ul>
     </nav>
</div>
 
<div id="teste1" name="teste1" class="modal-body" style="float: left; margin-top: 10em;">
 <form action="" method="post">
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
     <h6><label for="Colaborador-text" class="col-form-label">Colaborador</label></h6>
     <div style="clear:both;"></div>
      <h6><select style="width:150px" name="pesquisar_colaborador">
        <option></option>
        <?php
        $sql = "SELECT Funcionario FROM centrodb.InfoLuvas WHERE Ativo = '1' AND Funcao = 'Limpeza' AND Valencia = 'LAR'";
        $qr = mysqli_query($conn, $sql);
        while($ln = mysqli_fetch_assoc($qr)){
        echo '<option<option value="'.$ln['Funcionario'].'">'.$ln['Funcionario'].'<value="teste">teste</option>';
        }option>
       <option ?>value="teste1">teste1</option>
      </select></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Inicio-name" class="col-form-label">Inicio</label></h6>
      <div style="clear:both;"></div>
      <h6><input type="Date" id="inicio" name="inicio" value="<?php echo date("Y'Y-m-d"d');?>"></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Fim-name" class="col-form-label">Fim</label></h6>
      <div style="clear:both;"></div>
      <h6><input type="Date" id="fim" name="fim" value="<?php echo date("Y'Y-m-d"d');?>"></h6>
   </div>
  </div>
  <div style="clear:both;"></div>
  <div class="modal-footer">
       <button class="btn btn-success" id="teste2" name="teste2" type="submit">Consultar</button>
  </div>
</form>
</div>
 
<?php 
date_default_timezone_set('Europe/Lisbon');
if(isset($_POST['pesquisar_colaborador']) && isset($_POST['inicio']) && isset($_POST['fim'])){
    $pesquisar1 = $_POST['pesquisar_colaborador'];
    $inicio = $_POST['inicio'];
    $fim = $_POST['fim'];
?>

<section id="s1">
<div class="wrapper" id="minhaDiv" style="display:none" >
<?php 

$result_cursos = "SELECT * FROM centrodb.RegistolimpALAA WHERE Colaborador LIKE '%$pesquisar1%' AND `data` BETWEEN '$inicio' AND '$fim' ORDER BY dataregisto DESC";
$resultado_cursos = mysqli_query($conn, $result_cursos);
$tabela .= '<div class="teste" id="tabela41" style="float: center" table align="center"><form  class="form-validate" action="" method="post"> 
    <div class="campo">
         
            <h1>
                <legend>
                    <center>
                        <strong>Consulta Tarefas Semanais Limpeza</strong>
            </center>
        </h1><br>
            
    </div>  
</form> ';
    
$tabela .= '<table border="5"><h4>
                <legend>
                    <center>
                        <strong>Móveis Arrastados e Rodapés dos Roupeiros (3ª feira) ALA A</strong>
            </center>
        </h4><br>';

$tabela .= '<tr>';

$tabela .='<thead>';

$tabela .= '<tr>';

$tabela .= '<th>Data'<th style="font-size: 12px;">Data Registo</th>';

$tabela .= '<th>Data'<th style="font-size: 12px;">Data da Tarefa</th>';

$tabela .= '<th>Colaborador<'<th style="font-size: 12px;">Colaborador</th>';

$tabela .= '<th>Observação<'<th style="font-size: 12px;">Observação</th>';

$tabela .= '</tr>';

$tabela .='</thead>'; 

$tabela .='<tbody>';

while($rows_cursos = mysqli_fetch_array($resultado_cursos)) {
    
$tabela .= '<tr>';

$tabela .= '<td style="width:30px;">'30px; font-size: 12px;">'.$rows_cursos['dataregisto'].'</td>';

$tabela .= '<td style="width:30px;">'30px; font-size: 12px;">'.$rows_cursos['data'].'</td>';

$tabela .= '<td style="width:200px;">'200px; font-size: 12px;">'.$rows_cursos['Colaborador'].'</td>';

$tabela .= '<td style="width:200px;">'200px; font-size: 12px;">'.$rows_cursos['Observacao'].'</td>';

$tabela .= '</tr>'; 

}
$tabela .= '</tr>';

$tabela .='</tbody>'; 

$tabela .= '</table>';

$tabela .= '</div>';

echo $tabela;

echo?> "<button class='btn
</div>
</section>

<section btnid="s2">
<div class="wrapper" id="minhaDiv1" style="display:none">
<?php 

$result_cursos1 = "SELECT * FROM centrodb.RegistolimpALAB WHERE Colaborador1 LIKE '%$pesquisar1%' AND `data1` BETWEEN '$inicio' AND '$fim' ORDER BY dataregisto1 DESC";
$resultado_cursos1 = mysqli_query($conn, $result_cursos1);
$tabela1 .= '<div class="teste" id="tabela42" style="float: center" table align="center"><form  class="form-info'validate" onclick='printElemaction="" method="post"> 
    <div class="campo">
         
            <h1>
                <legend>
                    <center>
                        <strong>Consulta Tarefas Semanais Limpeza</strong>
            </center>
        </h1><br>
            
    </div>  
</form> ';
$tabela1 .= '<table border="5"><h4>
                <legend>
                    <center>
                        <strong>Móveis Arrastados e Rodapés dos Roupeiros (\"tabela41\"5ª feira)'>Imprimir< ALA B</button>";strong>
            </center>
        </h4>';

$tabela1 .= '<tr>';

$tabela1 .='<thead>';

$tabela1 .= '<tr>';

$tabela1 .= '<th style="font-size: 12px;">Data Registo</th>';

$tabela1 .= '<th style="font-size: 12px;">Data da Tarefa</th>';

$tabela1 .= '<th style="font-size: 12px;">Colaborador</th>';

$tabela1 .= '<th style="font-size: 12px;">Observação</th>';

$tabela1 .= '</tr>';

$tabela1 .='</thead>'; 

$tabela1 .='<tbody>';

while($rows_cursos1 = mysqli_fetch_array($resultado_cursos1)) {
    
$tabela1 .= '<tr>';

$tabela1 .= '<td style="width:30px; font-size: 12px;">'.$rows_cursos1['dataregisto1'].'</td>';

$tabela1 .= '<td style="width:30px; font-size: 12px;">'.$rows_cursos1['data1'].'</td>';

$tabela1 .= '<td style="width:200px; font-size: 12px;">'.$rows_cursos1['Colaborador1'].'</td>';

$tabela1 .= '<td style="width:200px; font-size: 12px;">'.$rows_cursos1['Observacao1'].'</td>';

$tabela1 .= '</tr>'; 

}
$tabela1 .= '</tr>';

$tabela1 .='</tbody>'; 

$tabela1 .= '</table>';

$tabela1 .= '</div>';

echo $tabela1;

?>  
</div>
</section>
 
<?php
}
?>

Funciona mas queria melhorar dois aspetos.Mostro na imagem o resultado:

Primeiro quando faço o filtro por data devia abrir[![inserir a primeira section ao clicar no botão consultar.descrição da imagem aqui][1]][1]

O segundo aspeto é se fizer novo filtro manter aComo mostro na imagem não tenho nenhuma section que se encontra abertavisível. Para ficar visível tenho de clicar no momentomenu do lado esquerdo. Então faço o filtro por exemplo pela data e clico no botão consultar. Para ver o resultado retornado tenho de clicar num dos submenus.

Tentei desta forma, mas continuo com o mesmo resultado: Pretendia que ao clicar no botão consultar a primeira section ficasse visível sem ter de clicar em nenhum dos submenus. Depois disso é que clicava no submenu que pretendia. [1]: https://i.sstatic.net/93RCP.png

$(function() {
  $(".btn-show").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $(el).show();
    $("section > div").not(el).hide();
  });
});

Ao clicar no botão abrir o section

Criei um menu para as sections que criei. Fora das sections criei um form para filtrar pelo nome e data em todas as sections.

<script>
$(function() {
  $(".btn-show").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $("section > div:not("+el+"):visible").hide();
    $(el).show();
  });
  </script>
<!DOCTYPE html> 
<html>
<head> 
    <title></title>
<script
  src="https://code.jquery.com/jquery-1.9.1.min.js"
  integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ="
  crossorigin="anonymous"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-maskmoney/3.0.2/jquery.maskMoney.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
</head> 
<body>

<div class="wrapper">
<nav class="vertical">
    <ul class="men clearfix1">
        <li><a href="#Tarefas Diárias">Tarefas Diárias</a>
            
        </li>
        <li><a href="#Tarefas Semanais">Tarefas Semanais</a>
        <!-- Nível 1 -->
            <!-- submenu -->
            <ul class="sub-men clearfix1">
                <li><a href="#s1" class="btn-show" data-element="#minhaDiv">Gerais Quartos Ala A</a></li>
                <li><a href="#s2" class="btn-show" data-element="#minhaDiv1">Gerais Quartos Ala B</a></li>
                <li><a href="#s3" class="btn-show" data-element="#minhaDiv2">Esplanada/Cabeleireiro</a></li>
                <li><a href="#s4" class="btn-show" data-element="#minhaDiv3">Hig. Ind. Copa</a></li>
                <li><a href="#s5" class="btn-show" data-element="#minhaDiv4">Gab. Enf/Méd/Admin (Sábado)</a></li>
                <li><a href="#s6" class="btn-show" data-element="#minhaDiv5">Gab. Enf/Méd/Admin (Domingo)</a></li>
            </ul><!-- submenu -->
        </li>
        <li><a href="#Tarefas Mensais">Tarefas Mensais</a></li>
        <li><a href="#Tarefas Trimestrais">Tarefas Trimestrais</a></li>
    </ul>
    </nav>
</div>
<div id="teste1" name="teste1" class="modal-body" style="float: left; margin-top: 10em;">
 <form action="" method="post">
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
     <h6><label for="Colaborador-text" class="col-form-label">Colaborador</label></h6>
     <div style="clear:both;"></div>
      <h6><select style="width:150px" name="pesquisar_colaborador">
        <option></option>
        <?php
        $sql = "SELECT Funcionario FROM centrodb.InfoLuvas WHERE Ativo = '1' AND Funcao = 'Limpeza' AND Valencia = 'LAR'";
        $qr = mysqli_query($conn, $sql);
        while($ln = mysqli_fetch_assoc($qr)){
        echo '<option value="'.$ln['Funcionario'].'">'.$ln['Funcionario'].'</option>';
        }
        ?>
      </select></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Inicio-name" class="col-form-label">Inicio</label></h6>
      <div style="clear:both;"></div>
      <h6><input type="Date" id="inicio" name="inicio" value="<?php echo date("Y-m-d");?>"></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Fim-name" class="col-form-label">Fim</label></h6>
      <div style="clear:both;"></div>
      <h6><input type="Date" id="fim" name="fim" value="<?php echo date("Y-m-d");?>"></h6>
   </div>
  </div>
  <div style="clear:both;"></div>
  <div class="modal-footer">
       <button class="btn btn-success" id="teste2" name="teste2" type="submit">Consultar</button>
  </div>
</form>
</div>
<?php 
date_default_timezone_set('Europe/Lisbon');
if(isset($_POST['pesquisar_colaborador']) && isset($_POST['inicio']) && isset($_POST['fim'])){
    $pesquisar1 = $_POST['pesquisar_colaborador'];
    $inicio = $_POST['inicio'];
    $fim = $_POST['fim'];
?>

<section id="s1">
<div class="wrapper" id="minhaDiv" style="display:none" >
<?php 

$result_cursos = "SELECT * FROM centrodb.RegistolimpALAA WHERE Colaborador LIKE '%$pesquisar1%' AND `data` BETWEEN '$inicio' AND '$fim' ORDER BY dataregisto DESC";
$resultado_cursos = mysqli_query($conn, $result_cursos);
$tabela .= '<div class="teste" id="tabela41" style="float: center" table align="center"><form  class="form-validate" action="" method="post"> 
    <div class="campo">
         
            <h1>
                <legend>
                    <center>
                        <strong>Consulta Tarefas Semanais Limpeza</strong>
            </center>
        </h1><br>
            
    </div>  
</form> ';
    
$tabela .= '<table border="5"><h4>
                <legend>
                    <center>
                        <strong>Móveis Arrastados e Rodapés dos Roupeiros (3ª feira) ALA A</strong>
            </center>
        </h4><br>';

$tabela .= '<tr>';

$tabela .='<thead>';

$tabela .= '<tr>';

$tabela .= '<th>Data Registo</th>';

$tabela .= '<th>Data da Tarefa</th>';

$tabela .= '<th>Colaborador</th>';

$tabela .= '<th>Observação</th>';

$tabela .= '</tr>';

$tabela .='</thead>'; 

$tabela .='<tbody>';

while($rows_cursos = mysqli_fetch_array($resultado_cursos)) {
    
$tabela .= '<tr>';

$tabela .= '<td style="width:30px;">'.$rows_cursos['dataregisto'].'</td>';

$tabela .= '<td style="width:30px;">'.$rows_cursos['data'].'</td>';

$tabela .= '<td style="width:200px;">'.$rows_cursos['Colaborador'].'</td>';

$tabela .= '<td style="width:200px;">'.$rows_cursos['Observacao'].'</td>';

$tabela .= '</tr>'; 

}
$tabela .= '</tr>';

$tabela .='</tbody>'; 

$tabela .= '</table>';

$tabela .= '</div>';

echo $tabela;

echo "<button class='btn btn-info' onclick='printElem(\"tabela41\")'>Imprimir</button>";

?>  
</div>
</section>
<?php
}
?>

Funciona mas queria melhorar dois aspetos.

Primeiro quando faço o filtro por data devia abrir a primeira section ao clicar no botão consultar.

O segundo aspeto é se fizer novo filtro manter a section que se encontra aberta no momento.

Tentei desta forma, mas continuo com o mesmo resultado:

$(function() {
  $(".btn-show").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $(el).show();
    $("section > div").not(el).hide();
  });
});

Manter sempre uma section visível em php

Criei um menu e para cada um deles criei uma section. Depois do menu criei um form com os inputs para filtrar por colaborar e por data. Depois criei as sections.

<script>
$(function() {
  $(".btn-show").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $(el).show();
    $("section > div").not(el).hide();
  });
});
</script>
<div class="wrapper">
    <nav class="vertical">
        <ul class="men clearfix1">
        <li><a href="#Tarefas Semanais">Tarefas Semanais</a>
                <ul class="sub-men clearfix1">
                    <li><a href="#s1" class="btn-show" data-element="#minhaDiv">Gerais Quartos Ala A</a></li>
                    <li><a href="#s2" class="btn-show" data-element="#minhaDiv1">Gerais Quartos Ala B</a>
                 </ul>
          </li>
        </ul>
     </nav>
</div>
 
<div class="modal-body" style="float: left; margin-top: 10em;">
 <form action="" method="post">
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
     <h6><label for="Colaborador-text" class="col-form-label">Colaborador</label></h6>
     <div style="clear:both;"></div>
      <h6><select style="width:150px" name="pesquisar_colaborador">
        <option></option>
        <option value="teste">teste</option>
    <option value="teste1">teste1</option>
      </select></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Inicio-name" class="col-form-label">Inicio</label></h6>
      <div style="clear:both;"></div>
      <h6><input type="Date" id="inicio" name="inicio" value="<?php echo date('Y-m-d');?>"></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Fim-name" class="col-form-label">Fim</label></h6>
      <div style="clear:both;"></div>
      <h6><input type="Date" id="fim" name="fim" value="<?php echo date('Y-m-d');?>"></h6>
   </div>
  </div>
  <div style="clear:both;"></div>
  <div class="modal-footer">
       <button class="btn btn-success" type="submit">Consultar</button>
  </div>
</form>
</div>
 
<?php 
date_default_timezone_set('Europe/Lisbon');
if(isset($_POST['pesquisar_colaborador']) && isset($_POST['inicio']) && isset($_POST['fim'])){
    $pesquisar1 = $_POST['pesquisar_colaborador'];
    $inicio = $_POST['inicio'];
    $fim = $_POST['fim'];
?>

<section id="s1">
<div class="wrapper" id="minhaDiv" style="display:none" >
<?php 

$result_cursos = "SELECT * FROM centrodb.RegistolimpALAA WHERE Colaborador LIKE '%$pesquisar1%' AND `data` BETWEEN '$inicio' AND '$fim' ORDER BY dataregisto DESC";
$resultado_cursos = mysqli_query($conn, $result_cursos);
$tabela .= '<div class="teste" id="tabela41" style="float: center" table align="center"><form  class="form-validate" action="" method="post"> 
    <div class="campo">
         
            <h1>
                <legend>
                    <center>
                        <strong>Consulta Tarefas Semanais Limpeza</strong>
            </center>
        </h1><br>
            
    </div>  
</form> ';
    
$tabela .= '<table border="5"><h4>
                <legend>
                    <center>
                        <strong>Móveis Arrastados e Rodapés dos Roupeiros (3ª feira) ALA A</strong>
            </center>
        </h4><br>';

$tabela .= '<tr>';

$tabela .='<thead>';

$tabela .= '<tr>';

$tabela .= '<th style="font-size: 12px;">Data Registo</th>';

$tabela .= '<th style="font-size: 12px;">Data da Tarefa</th>';

$tabela .= '<th style="font-size: 12px;">Colaborador</th>';

$tabela .= '<th style="font-size: 12px;">Observação</th>';

$tabela .= '</tr>';

$tabela .='</thead>'; 

$tabela .='<tbody>';

while($rows_cursos = mysqli_fetch_array($resultado_cursos)) {
    
$tabela .= '<tr>';

$tabela .= '<td style="width:30px; font-size: 12px;">'.$rows_cursos['dataregisto'].'</td>';

$tabela .= '<td style="width:30px; font-size: 12px;">'.$rows_cursos['data'].'</td>';

$tabela .= '<td style="width:200px; font-size: 12px;">'.$rows_cursos['Colaborador'].'</td>';

$tabela .= '<td style="width:200px; font-size: 12px;">'.$rows_cursos['Observacao'].'</td>';

$tabela .= '</tr>'; 

}
$tabela .= '</tr>';

$tabela .='</tbody>'; 

$tabela .= '</table>';

$tabela .= '</div>';

echo $tabela;

?>  
</div>
</section>

<section id="s2">
<div class="wrapper" id="minhaDiv1" style="display:none">
<?php 

$result_cursos1 = "SELECT * FROM centrodb.RegistolimpALAB WHERE Colaborador1 LIKE '%$pesquisar1%' AND `data1` BETWEEN '$inicio' AND '$fim' ORDER BY dataregisto1 DESC";
$resultado_cursos1 = mysqli_query($conn, $result_cursos1);
$tabela1 .= '<div class="teste" id="tabela42" style="float: center" table align="center"><form  class="form-validate" action="" method="post"> 
    <div class="campo">
         
            <h1>
                <legend>
                    <center>
                        <strong>Consulta Tarefas Semanais Limpeza</strong>
            </center>
        </h1><br>
            
    </div>  
</form> ';
$tabela1 .= '<table border="5"><h4>
                <legend>
                    <center>
                        <strong>Móveis Arrastados e Rodapés dos Roupeiros (5ª feira) ALA B</strong>
            </center>
        </h4>';

$tabela1 .= '<tr>';

$tabela1 .='<thead>';

$tabela1 .= '<tr>';

$tabela1 .= '<th style="font-size: 12px;">Data Registo</th>';

$tabela1 .= '<th style="font-size: 12px;">Data da Tarefa</th>';

$tabela1 .= '<th style="font-size: 12px;">Colaborador</th>';

$tabela1 .= '<th style="font-size: 12px;">Observação</th>';

$tabela1 .= '</tr>';

$tabela1 .='</thead>'; 

$tabela1 .='<tbody>';

while($rows_cursos1 = mysqli_fetch_array($resultado_cursos1)) {
    
$tabela1 .= '<tr>';

$tabela1 .= '<td style="width:30px; font-size: 12px;">'.$rows_cursos1['dataregisto1'].'</td>';

$tabela1 .= '<td style="width:30px; font-size: 12px;">'.$rows_cursos1['data1'].'</td>';

$tabela1 .= '<td style="width:200px; font-size: 12px;">'.$rows_cursos1['Colaborador1'].'</td>';

$tabela1 .= '<td style="width:200px; font-size: 12px;">'.$rows_cursos1['Observacao1'].'</td>';

$tabela1 .= '</tr>'; 

}
$tabela1 .= '</tr>';

$tabela1 .='</tbody>'; 

$tabela1 .= '</table>';

$tabela1 .= '</div>';

echo $tabela1;

?>  
</div>
</section>
 
<?php
}
?>

Mostro na imagem o resultado:

[![inserir a descrição da imagem aqui][1]][1]

Como mostro na imagem não tenho nenhuma section visível. Para ficar visível tenho de clicar no menu do lado esquerdo. Então faço o filtro por exemplo pela data e clico no botão consultar. Para ver o resultado retornado tenho de clicar num dos submenus.

Pretendia que ao clicar no botão consultar a primeira section ficasse visível sem ter de clicar em nenhum dos submenus. Depois disso é que clicava no submenu que pretendia. [1]: https://i.sstatic.net/93RCP.png

adicionou 282 caracteres ao conteúdo
Fonte Link
Bruno
  • 1,4mil
  • 12
  • 37

Tentei desta forma, mas continuo com o mesmo resultado:

$(function() {
  $(".btn-show").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $(el).show();
    $("section > div").not(el).hide();
  });
});

Tentei desta forma, mas continuo com o mesmo resultado:

$(function() {
  $(".btn-show").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $(el).show();
    $("section > div").not(el).hide();
  });
});
adicionou 2689 caracteres ao conteúdo; título editado
Fonte Link
Bruno
  • 1,4mil
  • 12
  • 37

Filtro por nome e data dentro do Ao clicar no botão abrir o section

Criei um menu para as sectionsections na minha página e pretendo dentro de cadaque criei. Fora das sectionsections criar filtro por data ecriei um form para filtrar pelo nome e data em todas as sections.

<section id="s1">
<div class="wrapper" id="minhaDiv" style="display:none" >

<div class="modal-body">
 <form action="" method="post">
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
     <h6><label for="Colaborador-text" class="col-form-label">Colaborador</label></h6>
      <h6><select style="width:150px" name="pesquisar_colaborador">
        <option></option>
        <?php
        $sql = "SELECT Funcionario FROM centrodb.InfoLuvas WHERE Ativo = '1' AND Funcao = 'Limpeza' AND Valencia = 'LAR'";
        $qr = mysqli_query($conn, $sql);
        while($ln = mysqli_fetch_assoc($qr)){
        echo '<option value="'.$ln['Funcionario'].'">'.$ln['Funcionario'].'</option>';
        }
        ?>
      </select></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Inicio-name" class="col-form-label">Inicio</label></h6>
      <h6><input type="Date" id="inicio" name="inicio" value="<?php echo date("Y-m-d");?>"></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Fim-name" class="col-form-label">Fim</label></h6>
      <h6><input type="Date" id="fim" name="fim" value="<?php echo date("Y-m-d");?>"></h6>
   </div>
  </div>
  <div class="modal-footer">
       <button class="btn btn-success" type="submit">Consultar</button>
  </div>
</form>
</div>

<?php 
date_default_timezone_set('Europe/Lisbon');
if(isset($_POST['pesquisar_colaborador']) && isset($_POST['inicio']) && isset($_POST['fim'])){
    $pesquisar1 = $_POST['pesquisar_colaborador'];
    $inicio = $_POST['inicio'];
    $fim = $_POST['fim'];
$result_cursos = "SELECT * FROM centrodb.RegistolimpALAA WHERE Colaborador LIKE '%$pesquisar1%' AND `data` BETWEEN '$inicio' AND '$fim' ORDER BY dataregisto DESC";
$resultado_cursos = mysqli_query($conn, $result_cursos);

echo $tabela;

?>  
</div>
</section>

script:

<script>
$(function() {
  $(".btn-show").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $("section > div:not("+el+"):visible").hide();
    $(el).show();
  });
  </script>
<!DOCTYPE html> 
<html>
<head> 
    <title></title>
<script
  src="https://code.jquery.com/jquery-1.9.1.min.js"
  integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ="
  crossorigin="anonymous"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-maskmoney/3.0.2/jquery.maskMoney.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
</head> 
<body>

<div class="wrapper">
<nav class="vertical">
    <ul class="men clearfix1">
        <li><a href="#Tarefas Diárias">Tarefas Diárias</a>
            
        </li>
        <li><a href="#Tarefas Semanais">Tarefas Semanais</a>
        <!-- Nível 1 -->
            <!-- submenu -->
            <ul class="sub-men clearfix1">
                <li><a href="#s1" class="btn-show" data-element="#minhaDiv">Gerais Quartos Ala A</a></li>
                <li><a href="#s2" class="btn-show" data-element="#minhaDiv1">Gerais Quartos Ala B</a></li>
                <li><a href="#s3" class="btn-show" data-element="#minhaDiv2">Esplanada/Cabeleireiro</a></li>
                <li><a href="#s4" class="btn-show" data-element="#minhaDiv3">Hig. Ind. Copa</a></li>
                <li><a href="#s5" class="btn-show" data-element="#minhaDiv4">Gab. Enf/Méd/Admin (Sábado)</a></li>
                <li><a href="#s6" class="btn-show" data-element="#minhaDiv5">Gab. Enf/Méd/Admin (Domingo)</a></li>
            </ul><!-- submenu -->
        </li>
        <li><a href="#Tarefas Mensais">Tarefas Mensais</a></li>
        <li><a href="#Tarefas Trimestrais">Tarefas Trimestrais</a></li>
    </ul>
    </nav>
</div>
<div id="teste1" name="teste1" class="modal-body" style="float: left; margin-top: 10em;">
 <form action="" method="post">
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
     <h6><label for="Colaborador-text" class="col-form-label">Colaborador</label></h6>
     <div style="clear:both;"></div>
      <h6><select style="width:150px" name="pesquisar_colaborador">
        <option></option>
        <?php
        $sql = "SELECT Funcionario FROM centrodb.InfoLuvas WHERE Ativo = '1' AND Funcao = 'Limpeza' AND Valencia = 'LAR'";
        $qr = mysqli_query($conn, $sql);
        while($ln = mysqli_fetch_assoc($qr)){
        echo '<option value="'.$ln['Funcionario'].'">'.$ln['Funcionario'].'</option>';
        }
        ?>
      </select></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Inicio-name" class="col-form-label">Inicio</label></h6>
      <div style="clear:both;"></div>
      <h6><input type="Date" id="inicio" name="inicio" value="<?php echo date("Y-m-d");?>"></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Fim-name" class="col-form-label">Fim</label></h6>
      <div style="clear:both;"></div>
      <h6><input type="Date" id="fim" name="fim" value="<?php echo date("Y-m-d");?>"></h6>
   </div>
  </div>
  <div style="clear:both;"></div>
  <div class="modal-footer">
       <button class="btn btn-success" id="teste2" name="teste2" type="submit">Consultar</button>
  </div>
</form>
</div>
<?php 
date_default_timezone_set('Europe/Lisbon');
if(isset($_POST['pesquisar_colaborador']) && isset($_POST['inicio']) && isset($_POST['fim'])){
    $pesquisar1 = $_POST['pesquisar_colaborador'];
    $inicio = $_POST['inicio'];
    $fim = $_POST['fim'];
?>

<section id="s1">
<div class="wrapper" id="minhaDiv" style="display:none" >
<?php 

$result_cursos = "SELECT * FROM centrodb.RegistolimpALAA WHERE Colaborador LIKE '%$pesquisar1%' AND `data` BETWEEN '$inicio' AND '$fim' ORDER BY dataregisto DESC";
$resultado_cursos = mysqli_query($conn, $result_cursos);
$tabela .= '<div class="teste" id="tabela41" style="float: center" table align="center"><form  class="form-validate" action="" method="post"> 
    <div class="campo">
         
            <h1>
                <legend>
                    <center>
                        <strong>Consulta Tarefas Semanais Limpeza</strong>
            </center>
        </h1><br>
            
    </div>  
</form> ';
    
$tabela .= '<table border="5"><h4>
                <legend>
                    <center>
                        <strong>Móveis Arrastados e Rodapés dos Roupeiros (3ª feira) ALA A</strong>
            </center>
        </h4><br>';

$tabela .= '<tr>';

$tabela .='<thead>';

$tabela .= '<tr>';

$tabela .= '<th>Data Registo</th>';

$tabela .= '<th>Data da Tarefa</th>';

$tabela .= '<th>Colaborador</th>';

$tabela .= '<th>Observação</th>';

$tabela .= '</tr>';

$tabela .='</thead>'; 

$tabela .='<tbody>';

while($rows_cursos = mysqli_fetch_array($resultado_cursos)) {
    
$tabela .= '<tr>';

$tabela .= '<td style="width:30px;">'.$rows_cursos['dataregisto'].'</td>';

$tabela .= '<td style="width:30px;">'.$rows_cursos['data'].'</td>';

$tabela .= '<td style="width:200px;">'.$rows_cursos['Colaborador'].'</td>';

$tabela .= '<td style="width:200px;">'.$rows_cursos['Observacao'].'</td>';

$tabela .= '</tr>'; 

}
$tabela .= '</tr>';

$tabela .='</tbody>'; 

$tabela .= '</table>';

$tabela .= '</div>';

echo $tabela;

echo "<button class='btn btn-info' onclick='printElem(\"tabela41\")'>Imprimir</button>";

?>  
</div>
</section>
<?php
}
?>
<script type="text/javascript"> 
$(function() {
  $(".btn-toggle").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $("section > div:not("+el+"):visible").hide();
    $(el).toggle();
  });
});
</script>
 

Assim funciona,Funciona mas sempre que clico no botãoqueria melhorar dois aspetos.

Primeiro quando faço o filtro por data devia abrir a primeira consultarsection fecha aao clicar no botão sectionconsultar e tenho de a abrir outra vez e não devia, devia fazer a consulta e manter a section aberta.

A class btn-toggleO segundo aspeto é utilizada no menu que chama asse fizer novo filtro manter a sectionssection: que se encontra aberta no momento.

<div class="wrapper">
<nav class="vertical">
    <ul class="men clearfix1">
        <li><a href="#Tarefas Diárias">Tarefas Diárias</a>
            <!-- Nível 1 -->
            <!-- submenu -->
            <ul class="sub-men clearfix1">
                <li><a href="#s1" class="btn-show" data-element="#minhaDiv">Gerais Quartos Ala A</a></li>
                <li><a href="#s2" class="btn-show" data-element="#minhaDiv1">Gerais Quartos Ala B</a></li>
                <li><a href="#s3" class="btn-show" data-element="#minhaDiv2">Esplanada/Cabeleireiro</a></li>
                <li><a href="#s4" class="btn-show" data-element="#minhaDiv3">Hig. Ind. Copa</a></li>
                <li><a href="#s5" class="btn-show" data-element="#minhaDiv4">Gab. Enf/Méd/Admin (Sábado)</a></li>
                <li><a href="#s6" class="btn-show" data-element="#minhaDiv5">Gab. Enf/Méd/Admin (Domingo)</a></li>
                <li><a href="#s7" class="btn-show" data-element="#minhaDiv6">Observação</a></li>
            </ul><!-- submenu -->
        </li>
        <li><a href="#Tarefas Semanais">Tarefas Semanais</a></li>
        <li><a href="#Tarefas Mensais">Tarefas Mensais</a></li>
        <li><a href="#Tarefas Trimestrais">Tarefas Trimestrais</a></li>
    </ul>
    </nav>
</div>

Filtro por nome e data dentro do section

Criei section na minha página e pretendo dentro de cada section criar filtro por data e nome.

<section id="s1">
<div class="wrapper" id="minhaDiv" style="display:none" >

<div class="modal-body">
 <form action="" method="post">
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
     <h6><label for="Colaborador-text" class="col-form-label">Colaborador</label></h6>
      <h6><select style="width:150px" name="pesquisar_colaborador">
        <option></option>
        <?php
        $sql = "SELECT Funcionario FROM centrodb.InfoLuvas WHERE Ativo = '1' AND Funcao = 'Limpeza' AND Valencia = 'LAR'";
        $qr = mysqli_query($conn, $sql);
        while($ln = mysqli_fetch_assoc($qr)){
        echo '<option value="'.$ln['Funcionario'].'">'.$ln['Funcionario'].'</option>';
        }
        ?>
      </select></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Inicio-name" class="col-form-label">Inicio</label></h6>
      <h6><input type="Date" id="inicio" name="inicio" value="<?php echo date("Y-m-d");?>"></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Fim-name" class="col-form-label">Fim</label></h6>
      <h6><input type="Date" id="fim" name="fim" value="<?php echo date("Y-m-d");?>"></h6>
   </div>
  </div>
  <div class="modal-footer">
       <button class="btn btn-success" type="submit">Consultar</button>
  </div>
</form>
</div>

<?php 
date_default_timezone_set('Europe/Lisbon');
if(isset($_POST['pesquisar_colaborador']) && isset($_POST['inicio']) && isset($_POST['fim'])){
    $pesquisar1 = $_POST['pesquisar_colaborador'];
    $inicio = $_POST['inicio'];
    $fim = $_POST['fim'];
$result_cursos = "SELECT * FROM centrodb.RegistolimpALAA WHERE Colaborador LIKE '%$pesquisar1%' AND `data` BETWEEN '$inicio' AND '$fim' ORDER BY dataregisto DESC";
$resultado_cursos = mysqli_query($conn, $result_cursos);

echo $tabela;

?>  
</div>
</section>

script:

<script type="text/javascript"> 
$(function() {
  $(".btn-toggle").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $("section > div:not("+el+"):visible").hide();
    $(el).toggle();
  });
});
</script>

Assim funciona, mas sempre que clico no botão consultar fecha a section e tenho de a abrir outra vez e não devia, devia fazer a consulta e manter a section aberta.

A class btn-toggle é utilizada no menu que chama as sections:

<div class="wrapper">
<nav class="vertical">
    <ul class="men clearfix1">
        <li><a href="#Tarefas Diárias">Tarefas Diárias</a>
            <!-- Nível 1 -->
            <!-- submenu -->
            <ul class="sub-men clearfix1">
                <li><a href="#s1" class="btn-show" data-element="#minhaDiv">Gerais Quartos Ala A</a></li>
                <li><a href="#s2" class="btn-show" data-element="#minhaDiv1">Gerais Quartos Ala B</a></li>
                <li><a href="#s3" class="btn-show" data-element="#minhaDiv2">Esplanada/Cabeleireiro</a></li>
                <li><a href="#s4" class="btn-show" data-element="#minhaDiv3">Hig. Ind. Copa</a></li>
                <li><a href="#s5" class="btn-show" data-element="#minhaDiv4">Gab. Enf/Méd/Admin (Sábado)</a></li>
                <li><a href="#s6" class="btn-show" data-element="#minhaDiv5">Gab. Enf/Méd/Admin (Domingo)</a></li>
                <li><a href="#s7" class="btn-show" data-element="#minhaDiv6">Observação</a></li>
            </ul><!-- submenu -->
        </li>
        <li><a href="#Tarefas Semanais">Tarefas Semanais</a></li>
        <li><a href="#Tarefas Mensais">Tarefas Mensais</a></li>
        <li><a href="#Tarefas Trimestrais">Tarefas Trimestrais</a></li>
    </ul>
    </nav>
</div>

Ao clicar no botão abrir o section

Criei um menu para as sections que criei. Fora das sections criei um form para filtrar pelo nome e data em todas as sections.

<script>
$(function() {
  $(".btn-show").click(function(e) {
    e.preventDefault();
    el = $(this).data('element');
    $("section > div:not("+el+"):visible").hide();
    $(el).show();
  });
  </script>
<!DOCTYPE html> 
<html>
<head> 
    <title></title>
<script
  src="https://code.jquery.com/jquery-1.9.1.min.js"
  integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ="
  crossorigin="anonymous"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-maskmoney/3.0.2/jquery.maskMoney.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
</head> 
<body>

<div class="wrapper">
<nav class="vertical">
    <ul class="men clearfix1">
        <li><a href="#Tarefas Diárias">Tarefas Diárias</a>
            
        </li>
        <li><a href="#Tarefas Semanais">Tarefas Semanais</a>
        <!-- Nível 1 -->
            <!-- submenu -->
            <ul class="sub-men clearfix1">
                <li><a href="#s1" class="btn-show" data-element="#minhaDiv">Gerais Quartos Ala A</a></li>
                <li><a href="#s2" class="btn-show" data-element="#minhaDiv1">Gerais Quartos Ala B</a></li>
                <li><a href="#s3" class="btn-show" data-element="#minhaDiv2">Esplanada/Cabeleireiro</a></li>
                <li><a href="#s4" class="btn-show" data-element="#minhaDiv3">Hig. Ind. Copa</a></li>
                <li><a href="#s5" class="btn-show" data-element="#minhaDiv4">Gab. Enf/Méd/Admin (Sábado)</a></li>
                <li><a href="#s6" class="btn-show" data-element="#minhaDiv5">Gab. Enf/Méd/Admin (Domingo)</a></li>
            </ul><!-- submenu -->
        </li>
        <li><a href="#Tarefas Mensais">Tarefas Mensais</a></li>
        <li><a href="#Tarefas Trimestrais">Tarefas Trimestrais</a></li>
    </ul>
    </nav>
</div>
<div id="teste1" name="teste1" class="modal-body" style="float: left; margin-top: 10em;">
 <form action="" method="post">
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
     <h6><label for="Colaborador-text" class="col-form-label">Colaborador</label></h6>
     <div style="clear:both;"></div>
      <h6><select style="width:150px" name="pesquisar_colaborador">
        <option></option>
        <?php
        $sql = "SELECT Funcionario FROM centrodb.InfoLuvas WHERE Ativo = '1' AND Funcao = 'Limpeza' AND Valencia = 'LAR'";
        $qr = mysqli_query($conn, $sql);
        while($ln = mysqli_fetch_assoc($qr)){
        echo '<option value="'.$ln['Funcionario'].'">'.$ln['Funcionario'].'</option>';
        }
        ?>
      </select></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Inicio-name" class="col-form-label">Inicio</label></h6>
      <div style="clear:both;"></div>
      <h6><input type="Date" id="inicio" name="inicio" value="<?php echo date("Y-m-d");?>"></h6>
   </div>
  </div>
 <div style="clear:both;"></div>
  <div class="col-md-2 col-xs-2">
   <div class="form-group">
      <h6><label for="Fim-name" class="col-form-label">Fim</label></h6>
      <div style="clear:both;"></div>
      <h6><input type="Date" id="fim" name="fim" value="<?php echo date("Y-m-d");?>"></h6>
   </div>
  </div>
  <div style="clear:both;"></div>
  <div class="modal-footer">
       <button class="btn btn-success" id="teste2" name="teste2" type="submit">Consultar</button>
  </div>
</form>
</div>
<?php 
date_default_timezone_set('Europe/Lisbon');
if(isset($_POST['pesquisar_colaborador']) && isset($_POST['inicio']) && isset($_POST['fim'])){
    $pesquisar1 = $_POST['pesquisar_colaborador'];
    $inicio = $_POST['inicio'];
    $fim = $_POST['fim'];
?>

<section id="s1">
<div class="wrapper" id="minhaDiv" style="display:none" >
<?php 

$result_cursos = "SELECT * FROM centrodb.RegistolimpALAA WHERE Colaborador LIKE '%$pesquisar1%' AND `data` BETWEEN '$inicio' AND '$fim' ORDER BY dataregisto DESC";
$resultado_cursos = mysqli_query($conn, $result_cursos);
$tabela .= '<div class="teste" id="tabela41" style="float: center" table align="center"><form  class="form-validate" action="" method="post"> 
    <div class="campo">
         
            <h1>
                <legend>
                    <center>
                        <strong>Consulta Tarefas Semanais Limpeza</strong>
            </center>
        </h1><br>
            
    </div>  
</form> ';
    
$tabela .= '<table border="5"><h4>
                <legend>
                    <center>
                        <strong>Móveis Arrastados e Rodapés dos Roupeiros (3ª feira) ALA A</strong>
            </center>
        </h4><br>';

$tabela .= '<tr>';

$tabela .='<thead>';

$tabela .= '<tr>';

$tabela .= '<th>Data Registo</th>';

$tabela .= '<th>Data da Tarefa</th>';

$tabela .= '<th>Colaborador</th>';

$tabela .= '<th>Observação</th>';

$tabela .= '</tr>';

$tabela .='</thead>'; 

$tabela .='<tbody>';

while($rows_cursos = mysqli_fetch_array($resultado_cursos)) {
    
$tabela .= '<tr>';

$tabela .= '<td style="width:30px;">'.$rows_cursos['dataregisto'].'</td>';

$tabela .= '<td style="width:30px;">'.$rows_cursos['data'].'</td>';

$tabela .= '<td style="width:200px;">'.$rows_cursos['Colaborador'].'</td>';

$tabela .= '<td style="width:200px;">'.$rows_cursos['Observacao'].'</td>';

$tabela .= '</tr>'; 

}
$tabela .= '</tr>';

$tabela .='</tbody>'; 

$tabela .= '</table>';

$tabela .= '</div>';

echo $tabela;

echo "<button class='btn btn-info' onclick='printElem(\"tabela41\")'>Imprimir</button>";

?>  
</div>
</section>
<?php
}
?>
 

Funciona mas queria melhorar dois aspetos.

Primeiro quando faço o filtro por data devia abrir a primeira section ao clicar no botão consultar.

O segundo aspeto é se fizer novo filtro manter a section que se encontra aberta no momento.

adicionou 69 caracteres ao conteúdo
Fonte Link
Bruno
  • 1,4mil
  • 12
  • 37
Carregando
Fonte Link
Bruno
  • 1,4mil
  • 12
  • 37
Carregando