FOR SEM EXPLICAÇÃO - PELO MENOS PRA MIM

Rafael da Silveira · Abril 28, 2017

Amigos, estou desenvolvendo um aplicativo de controle pra empresa de um parente.

Caixa...contas...e bla bla bla...

Tenho uma janela que pega as categorias do caixa...onde tenho a opção de adicionar uma outra categoria..editar ou excluir.

Você seleciona a categoria...edita ou exclui...ok ok...

o problema começa quando faço uma pesquisa no banco de dados.

Quando seleciono resultado e clico para editar ou exluir da um loop sem explicação!

segue o código da janela principal e do arquivo que chama os resultados...

ele mostra varias vezes a mesma janela...com o id do elemento clicado.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<?php include('../../accounts/check-session.php');?>

<style>
	#content-list-categorias{
		height:275px;
		min-height:275px;
		padding:0px;
	}
	#txt-search-categoria{
		position:relative;
		float:left;
		width:100%;
		padding:5px;
		box-sizing:border-box;
		border:none;
		outline:none;
	}
	
	.content-list{
		position:relative;
		width:100%;
		padding:0 5px;
		box-sizing:border-box;
		border:none;
		border-top:#EEE solid 1px;
		border-bottom:#EEE solid 1px;
		overflow:auto;
	}
	.content-list .item-list{
		position:relative;
		float:left;
		width:100%;
		padding:5px;
		box-sizing:border-box;
		list-style:none;
		border-bottom:#EEE solid 1px;
		cursor:context-menu;
		color:#666;
		transition:0.1s;
	}
	.content-list .item-list:hover{
		color:#000;
		padding-left:10px;
		padding-right:0px;
	}
	.content-list .item-list:last-child{
		border:none;
	}
	
	.content-menu-context{
		position:absolute;
		top:0px;
		left:0px;
		background:#F00;
		display:none;
	}
</style>

<body>
	<input type="text" id='txt-search-categoria' placeholder='Procurar..'/>
    
	<ul id='content-list-categorias' class='content-list'>
    	<!--motor-list-categoria.php-->
    </ul>
   
    
    
    <div class='button' id='btn-delete-categoria'>Excluir</div>
    <div class='button' id='btn-editar-categoria'>Editar</div>
    <div class='button' id='btn-open-nova-categoria'>Adicionar</div>
</body>
</html>

<script>
	//Carrega todas
	$('#content-list-categorias').load('/app/caixa/motor-list-categoria.php');

	//Carregar pesquisa
	document.querySelector('#txt-search-categoria').addEventListener('keyup',function(){
		$('#content-list-categorias').load('/app/caixa/motor-list-categoria.php',{pesquisa:this.value});
	});
	
	//Nova Categoria
	document.querySelector('#btn-open-nova-categoria').addEventListener('click',function(){
		adicionarCategoria.open();
		editarCategoria.close();
	});	
</script>

CÒDIGO PHP QUE LISTA OS RESULTADOS E CONTEM AS FUNÇÕES PARA A EDIÇÃO.

<?php
	session_start();
	$database = $_SESSION['database'];
	
	if(isset($_POST['pesquisa'])){ $pesquisa = $_POST['pesquisa'];}else{$pesquisa = '';}

	try{
		$conn = new PDO("mysql:host=localhost;dbname=$database", "root", "");
	
		if($pesquisa == ''){
			$sql = $conn->prepare("SELECT * FROM tbl_categoria_caixa ORDER BY categoria ASC");
		}else{
			$sql = $conn->prepare("SELECT * FROM tbl_categoria_caixa WHERE categoria LIKE :categoria ORDER BY categoria ASC");
			$sql -> bindValue(':categoria',"%".$pesquisa."%");
		}
		$sql -> execute();
		$cont = $sql->rowCount();
		$row = $sql->fetchAll(PDO::FETCH_OBJ);
			
		foreach($row as $dados){
			echo "<li id='idCategoria$dados->id' href='$dados->id' class='item-list' select='false'>$dados->categoria</li>";
		}
	}catch(PDOException $e){
		echo "Falha:002<br>Erro ao Pesquisar contas<br>";
		echo "Erro:" . $e->getMessage();
		exit;
	}
?>

<script>
	//MEMORIA
	var memoriaDeleteCategoria = "";

	//Selecionar
	var itemListCategoria = document.querySelectorAll('#content-list-categorias li');
		for(i=0; i < itemListCategoria.length; i++){
			itemListCategoria[i].addEventListener('click',function(){
				if(this.getAttribute('select') == 'false'){
					memoriaDeleteCategoria = "";
					memoriaDeleteCategoria = this.getAttribute('id');
					for(i=0; i < itemListCategoria.length; i++){
						itemListCategoria[i].style.background = '#FFF';
					}
					this.style.background = '#DDD';
					this.setAttribute('select','true');
				}else{
					memoriaDeleteCategoria = "";
					this.style.background = '#FFF';
					this.setAttribute('select','false');
				}
			});
		}
	
	//EDITAR
	document.querySelector('#btn-editar-categoria').addEventListener('click',function(){
		if(memoriaDeleteCategoria == ''){
			message('Nenhuma categoria selecionada!','info');
		}else{
			var id = document.querySelector('#'+memoriaDeleteCategoria).getAttribute('href');
			editarCategoria.setUrl('/app/caixa/view-edit-categoria.php?id=' + id);
			editarCategoria.open();
			adicionarCategoria.close();
		}
	});	
	
	//DELETAR CATEGORIA
	document.querySelector('#btn-delete-categoria').addEventListener('click',function(){
		alert(memoriaDeleteCategoria); //testando
		if(memoriaDeleteCategoria == ''){
			message('Nenhuma categoria selecionada!','info');
		}else{
			var nomeCategoria = document.querySelector('#'+ memoriaDeleteCategoria).innerHTML;
			ask("Deseja exluir '" + nomeCategoria + "' dos registros?",function(){
				var id = document.querySelector('#'+memoriaDeleteCategoria).getAttribute('href');
				$('#motor').load('/app/caixa/motor-delete-categoria.php',{id:id});
			});
		}
	});	
</script>

As Funçoes que tem ae.. message()....ask() são apenas chamadas pra janela modal - não existe loop dentro delas.

Quem souber qual o problema e puder me ajudar...abradeço!

Trabalho só com javascript puro...se alguem souber de alguma função que substitua o .load() do jquery e que traga o junto do da pagina html,javascript e css seria otimo.

abraços a todos

Entrar

Arquivado

FOR SEM EXPLICAÇÃO - PELO MENOS PRA MIM

Recommended Posts

Rafael da Silveira 1

Compartilhar este post

Link para o post

Compartilhar em outros sites

Javascript - Arredondar Valor para cima

PHP - Atualizar INPUT com função moeda

PHP - Atualizar INPUT com função moeda

Conteúdo Similar

Este projeto é apoiado pelas empresas

Fóruns

Tempo Real

Informação importante