Ir para conteúdo
    • João Batista Neto

      iMasters InterCon 2017   10-10-2017

      Ainda dá tempo de se inscrever no iMasters InterCon 2017, o maior evento dev do Brasil!  
  • 0
marlone

Sistema de busca sem refresh php

Pergunta

Como inserir um sistema de busca na minha tabela sem refresh, me ajudem por favor :D

<?php
	require('class/validacao.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php
		$titulo = "Controle &raquo; Listar Material";
		require_once ("includes/header.php"); 
	?>
</head>
<title> Listar material </title>
<style>
table, td, th {    
    border: 1px solid #ddd;
    text-align: left;
}

table {
    border-collapse: collapse;
    width: 100%;
}

th, td {
    padding: 15px;
}
</style>
</head>
<body>
				<?php
	require_once('includes/testes.php');
	?>
	
		
<?php
// Conexão ao banco
require_once('conexao.php');
?>
<div id="principal">
<h1>MATERIAIS</h1>

				<form action="<?php $_SERVER['PHP_SELF']?>" method="post">
	

					
<?php
echo"<table width='100%' border='1'>";
echo '<table>';
echo '<tr>';
echo'<td>id</td>';
echo'<td>NOME</td>';
echo'<td>SETOR</td>';
echo'<td>Estoque  Atual</td>';
echo'<td>MINIMO</td>';
echo'<td>Entrada</td>';
echo'<td>Saida</td>';
echo'<td>Editar</td>';
echo'<td>Excluir</td>';
echo '</tr>';
$result_mat = "SELECT * FROM tbl_material";
$resultado_mat = mysqli_query($conn, $result_mat);
while($row_mat = mysqli_fetch_assoc($resultado_mat)){
echo '<tr>';
echo '<td>'.$row_mat["id"].'</td>';
echo '<td>'.$row_mat["NOME"].'</td>';
echo '<td>'.$row_mat["SETOR"].'</td>';
echo '<td>'.$row_mat["QUANTIDADE"].'</td>';
echo '<td>'.$row_mat["MINIMO"].'</td>';
echo '<td><a href="form_entrada.php?id='.$row_mat['id'].'">✚</a>
      <td><a href="form_saida.php?id='.$row_mat['id'].'">▬</a>
		<td><a href="form_alteracao_material.php?id='.$row_mat['id'].'">✐</a>
      <td><a href="deleta1.php?id='.$row_mat['id'].'">✖</a>
      </tr>';
}
echo '</table>';

?>
										
		
				</form>
			</div> <!-- Fim da div#principal -->
				<?php include('includes/fimerodape.php'); ?>

</body>

</html>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

2 respostas a esta questão

Recommended Posts

  • 0

Voce deve usar ajax. Voce vai precisar de uma funcao JavaScript que vai basicamente fazer o PHP rodar novamente:

 

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
       //aqui voce recebera a resposta do PHP
       document.getElementById("demo").innerHTML = xhttp.responseText;
    }
};
xhttp.open("GET", "arquivo.php", true);
xhttp.send();

 

Era isso?

 

Compartilhar este post


Link para o post
Compartilhar em outros sites
  • 0

Outra maneira (dependendo da quantidade de dados) é fazer inteiramente com JavaScript...

 

<!DOCTYPE HTML>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>

<p>Filtro por Nome:</p>
<p style="margin-bottom: 5px;">Nome:</p>
<input type="text" name="nome" id="nomeDaEmpresa" placeholder="Informe o nome da Empresa"/>


	
<hr />
<h3>Dados:</h3>		
<table style="width: 100%;text-align: left;">
	<thead>
		<tr>
			<th>Nome da Empresa</th>
			<th>Status</th>
		</tr>
	</thead>
	<tbody id="dados">
	
	</tbody>

</table>



<script type="text/javascript">	
	var dados = [
		{
		  "Nome": "Carrefour",
		  "Status": true
		}
		,{
		  "Nome": "Pão de Açucar",
		  "Status": false
		}
		,{
		  "Nome": "Extra",
		  "Status": true
		}
		,{
		  "Nome": "WallMart",
		  "Status": true
		}
	];
	
	document.getElementById("nomeDaEmpresa").addEventListener("keyup", function() {
		
		var dadosCopy = dados.slice();
		const filterNome = this.value;
		
		
		var i = dadosCopy.length;
		while (i--) {
		
			var myRegex = new RegExp(filterNome, 'gi');			
			if(dadosCopy[i]['Nome'].match(myRegex) ==  null){
				dadosCopy.splice(i, 1); // Remove o elemento
			}
		}		
		
		popDados(dadosCopy);
	});	
	
	
	function popDados(myArr){
		var dadosTable = document.getElementById("dados");
		while (dadosTable.firstChild) {
			dadosTable.removeChild(dadosTable.firstChild);
		}
		
		for(var x = 0; x < myArr.length; x++){
			var trTable = document.createElement('tr');
			trTable.innerHTML = '<td>'+  myArr[x]['Nome'] +'</td>' + '<td>'+ myArr[x]['Status'] +'</td>';			 
			
			document.getElementById("dados").appendChild(trTable);
		}
	}
	
	//Logo ao iniciar o DOM
	popDados(dados);
</script>
</body>
</html>

https://fiddle.jshell.net/7Ldt3x7a/

 

Ps: 

Qualquer semelhança com 'filter' do Angular é mera coincidência 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora


  • Próximos Eventos

  • Conteúdo Similar

    • Por fainformatica
      Ola pessoal, tenho o seguinte probleminha... estou importando produtos de uma nota fiscal para o banco de dados, só que não estou conseguindo!
      Quando passo os dados, so consigo pegar o valor do primeiro item da lista(tabela)... onde estou errando ?
      $seq = 0; foreach($xml->NFe->infNFe->det as $item) { $seq++; $codigo = $item->prod->cProd; $cEAN = $item->prod->cEAN; $xProd = $item->prod->xProd; $NCM = $item->prod->NCM; $CFOP = $item->prod->CFOP; $uCom = $item->prod->uCom; $qCom = $item->prod->qCom; $qCom = number_format((double) $qCom, 2, ",", "."); $vUnCom = $item->prod->vUnCom; $vUnCom = number_format((double) $vUnCom, 2, ",", "."); $vProd = $item->prod->vProd; $vProd = number_format((double) $vProd, 2, ",", "."); $vBC_item = $item->imposto->ICMS->ICMS00->vBC; $icms00 = $item->imposto->ICMS->ICMS00; $icms10 = $item->imposto->ICMS->ICMS10; $icms20 = $item->imposto->ICMS->ICMS20; $icms30 = $item->imposto->ICMS->ICMS30; $icms40 = $item->imposto->ICMS->ICMS40; $icms50 = $item->imposto->ICMS->ICMS50; $icms51 = $item->imposto->ICMS->ICMS51; $icms60 = $item->imposto->ICMS->ICMS60; $ICMSSN102 = $item->imposto->ICMS->ICMSSN102; if(!empty($ICMSSN102)) { $bc_icms = "0.00"; $pICMS = "0 "; $vlr_icms = "0.00"; } if (!empty($icms00)) { $bc_icms = $item->imposto->ICMS->ICMS00->vBC; $bc_icms = number_format((double) $bc_icms, 2, ",", "."); $pICMS = $item->imposto->ICMS->ICMS00->pICMS; $pICMS = round($pICMS,0); $vlr_icms = $item->imposto->ICMS->ICMS00->vICMS; $vlr_icms = number_format((double) $vlr_icms, 2, ",", "."); } if (!empty($icms20)) { $bc_icms = $item->imposto->ICMS->ICMS20->vBC; $bc_icms = number_format((double) $bc_icms, 2, ",", "."); $pICMS = $item->imposto->ICMS->ICMS20->pICMS; $pICMS = round($pICMS,0); $vlr_icms = $item->imposto->ICMS->ICMS20->vICMS; $vlr_icms = number_format((double) $vlr_icms, 2, ",", "."); } if(!empty($icms30)) { $bc_icms = "0.00"; $pICMS = "0 "; $vlr_icms = "0.00"; } if(!empty($icms40)) { $bc_icms = "0.00"; $pICMS = "0 "; $vlr_icms = "0.00"; } if(!empty($icms50)) { $bc_icms = "0.00"; $pICMS = "0 "; $vlr_icms = "0.00"; } if(!empty($icms51)) { $bc_icms = $item->imposto->ICMS->ICMS51->vBC; $pICMS = $item->imposto->ICMS->ICMS51->pICMS; $pICMS = round($pICMS,0); $vlr_icms = $item->imposto->ICMS->ICMS51->vICMS; } if(!empty($icms60)) { $bc_icms = "0,00"; $pICMS = "0 "; $vlr_icms = "0,00"; } $IPITrib = $item->imposto->IPI->IPITrib; if (!empty($IPITrib)) { $bc_ipi =$item->imposto->IPI->IPITrib->vBC; $bc_ipi = number_format((double) $bc_ipi, 2, ",", "."); $perc_ipi = $item->imposto->IPI->IPITrib->pIPI; $perc_ipi = round($perc_ipi,0); $vlr_ipi = $item->imposto->IPI->IPITrib->vIPI; $vlr_ipi = number_format((double) $vlr_ipi, 2, ",", "."); } $IPINT = $item->imposto->IPI->IPINT; { $bc_ipi = "0,00"; $perc_ipi = "0"; $vlr_ipi = "0,00"; } if($seq % 2 == 0) $class = "class='cor2'"; else $class = "class='cor1'"; ?> <tr <?php echo $class ?> > <td align="center" ><input <?php echo $class ?> type="text" name="item" size="5" value="<?php echo $seq ?>"></td> <td><input type="text" name="codigo[]" size="8" <?php echo $class ?> value="<?php echo $codigo ?>" readonly="readonly" /></td> <td><input type="text" name="cEAN[]" <?php echo $class ?> size="20" value="<?php echo $cEAN ?>" readonly="readonly" /></td> <td><input type="text" name="xProd[]" <?php echo $class ?> size="60" value="<?php echo $xProd ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="NCM[]" size="8" value="<?php echo $NCM ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="CFOP[]" size="4" value="<?php echo $CFOP ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="uCom[]" size="2" value="<?php echo $uCom ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="qCom[]" size="10" value="<?php echo $qCom ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="vUnCom[]" size="10" value="<?php echo $vUnCom ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="vProd[]" size="10" value="<?php echo $vProd ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="vVenda[]" id="pvenda" size="10" value="<?php echo $vProd ?>" /></td> <td><input type="text" <?php echo $class ?> name="bc_icms[]" size="10" value="<?php echo $bc_icms ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="vlr_icms[]" size="10" value="<?php echo $vlr_icms ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="vlr_ipi[]" size="5" value="<?php echo $vlr_ipi ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="pICMS[]" size="5" value="<?php echo $pICMS ?>" readonly="readonly" /></td> <td><input type="text" <?php echo $class ?> name="perc_ipi[]" size="5" value="<?php echo $perc_ipi ?>" readonly="readonly" /></td> </tr> <?php } ?> </table> Agora onde recebo dos dados!
       
      <?php session_start(); for( $i=0; $i<count($_POST['item']); $i++ ) { echo 'Item: '.$_POST['item'][$i].'<br/>'; echo 'Codigo Barras: '.$_POST['cEAN'][$i].'<br/>'; echo 'Descrição: '.$_POST['xProd'][$i].'<br/>'; echo 'NCM: '.$_POST['NCM'][$i].'<br/>'; echo 'CFOP: '.$_POST['CFOP'][$i].'<br/>'; echo 'QTD: '.$_POST['qCom'][$i].'<br/>'; echo 'Vlr Compra: '.$_POST['vUnCom'][$i].'<br/>'; echo 'Vlr T Compra: '.$_POST['vProd'][$i].'<br/>'; echo 'Vlr de Venda: '.$_POST['vVenda'][$i].'<br/>'; echo "<br/>"; } ?>  
    • Por fainformatica
      Olá pessoal, hoje estou precisando do seguinte auxilio...
      tenho uma tela de busca no meu sistema php, e queria fazer o seguinte:
      Quando o usuário faz a pesquisa exibe várias linhas de resultados.
      queria que nesse while fosse possivel ele selecionar uma das linhas que foi
      e um botao EDITAR fosse exibido e passasse os dados dessa linha selecionada para que fosse possivel editar os dados da mesma.
      sei que tem javascript no meio, depois eu faço ele, queria mesmo era passar os dados da linha selecionada para o botao.
       
      Alguem ajuda ai. por favor!
    • Por Lúcio Marques
      Bom dia.
      Tenho um campo que busca nomes no banco de dados, mas para isso eu tenho que clicar em um botão Filtrar.
      Gostaria de saber se tem como fazer isso sem clicar no botão filtrar.
      Eu utilizei um com tbody, e deu certo. Mas teria que mostrar todos os dados na página para buscar.
      Também utilizei o comando dispaly="none", assim mostrando os 10 primeiros e escondendo o restante, mas somente buscar o que aparece, o que está escondido não busca.
      Então eu voltei para o padrão que busca direto no banco de dados, mas tem que ter o botão.
    • Por acitamrofni
      Olá, tenho uma dúvida, que acho que podem me ajudar.
      Tenho o Seguinte código:
      function geraTabela(num1, num2) { var soma= num1+num2; var sub = num1-num2; var mult = num1*num2; var div = num1/num2; document.write("<table align=center border=1 cellpadding=10><tr align=center bgcolor=black><td width=200><font face=Arial color=white>Operação</font></td><td width=200><font face=Arial color=white>Valor</font></td></tr>"); document.write("<tr align=center><td>"+num1+" + "+num2); document.write("</td><td>"+soma+"</td></tr>"); document.write("<tr align=center><td>"+num1+" - "+num2); document.write("</td><td>"+sub+"</td></tr>"); document.write("<tr align=center><td>"+num1+" * "+num2); document.write("</td><td>"+mult+"</td></tr>"); document.write("<tr align=center><td>"+num1+" / "+num2); document.write("</td><td>"+div+"</td></tr>"); document.write("</table>") } Eu invoco ele na página HTML e funciona, gera a tabela exatamente como eu quero, gostaria de saber apenas se existe uma maneira mais simples e fácil de fazer a mesma coisa.
      Obrigado desde já.
       
    • Por Leo Oliveira
      Olá gente, tudo bem com vocês? Então, estou precisando criar uma tabela com 5 imagens de produtos e três colunas, uma com o produto, outra com a descrição do produto e outra com um botão para fazer orçamento dos produtos já fucei muito e não estou tendo sucesso com isso... gostaria de saber se tem alguém que possa me auxiliar com essa tabela, já fiz uma vez, porém perdi e não consegui fazer mais, Pode ser utilizado boostrap! 
      Essa foi a que criei uma vez, mas sem querer perdi e não consegui refazer: 
      https://prnt.sc/goloi4
      Quem poder me ajudar agradeço muito! 
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

Este projeto é mantido e patrocinado pelas empresas:
Hospedado por: