Ir ao conteúdo

Posts recomendados

Postado

Eae galera, demorou mas estou aqui com problemas :D:D:D:D

Estou fazendo um cadastro de slide para site com modal e ajax mas não está funcionando corretamente, quando atualizo o primeiro slide ele funciona perfeitamente mas a partir do segundo não, ele fecha o modal (o que não deveria ser feito). Também estou com problemas para excluir e cadastrar um novo slide.

Fiz vários testes e nada funcionou, tentei colocar em arquivos diferentes tanto js quanto php, tentei nomear os formulários e etc. Sinceramente não sei o que fazer e onde está o problema.

Seguem os códigos.

 

page_home.php:

Spoiler

<div class="graph-box">
	<?php
	$sql 	= "SELECT id_admin_slide, titulo_slide, decricao_slide, nome_slide FROM admin_slide";
	$res 	= mysqli_query($link,$sql);
	$linha 	= mysqli_fetch_assoc($res);
	$dados	= mysqli_num_rows($res);
	$i 		= 1;
	if($dados > ){
		do{
			echo '
			<div class="col-md-4 graph-3">
				<h4>'.$linha['titulo_slide'].'</h4>
				<div class="gallery-img">	
					<img class="img-responsive" src="../dummy/'.$linha['nome_slide'].'">
				</div>
				<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#modalEditar'.$i.'">Editar</button>
				<button type="button" class="btn btn-danger btn-lg" data-toggle="modal" data-target="#modalExcluir'.$i.'">Excluir</button>
			</div>
			<div class="modal fade" id="modalEditar'.$i.'" role="dialog" data-backdrop="static">
				<div class="modal-dialog container2">
					<!-- Modal content-->
					<form id="editar" method="post" action="" enctype="multipart/form-data">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                <h4 class="modal-title">Atualizar '.$linha['titulo_slide'].'</h4>
							</div>
							<div class="modal-body">
								<div class="form-group">
							       	<label for="imagemSlideA">Adicionar Slide</label>
							       	<input name="imagemSlideA" type="file" id="imagemSlideA">
							       	<p class="help-block">Extensões permitidas: .jpeg e .png</p>
							       	<p class="help-block">Tamanho máximo: 1MB</p>
							       	<p class="help-block">É preferível que a imagem tenha boa resolução</p>
							    </div>
								<div class="form-group">
									<label for="tituloSlideA">Título</label>
									<input name="tituloSlideA" type="text" class="form-control" id="tituloSlideA" value="'.$linha['titulo_slide'].'">
								</div>
								<div class="form-group">
									<label for="descrSlideA">Descrição</label>
									<input name="descrSlideA" type="text" class="form-control" id="descrSlideA" value="'.$linha['decricao_slide'].'">
								</div>
								<input name="idSlideA" type="hidden" class="form-control" id="idSlide" value="'.$linha['id_admin_slide'].'">
								<input name="atz'.$i.'" type="hidden" class="form-control" id="atz'.$i.'" value="atz'.$i.'">
							</div>
							<div class="modal-footer">
								<div id="retorno"></div>
								<button name="atz'.$i.'" type="sumit" class="btn btn-success">Salvar</button>
								<button id="atz" type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>   
							</div>
						</div>
					</form>
				</div>
			</div>
			<div class="modal fade" id="modalExcluir'.$i.'" role="dialog" data-backdrop="static">
				<div class="modal-dialog container2">
					<!-- Modal content-->
					<form id="excluir" action="" method="post">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
								<h4 class="modal-title">'.$linha['titulo_slide'].'</h4>
							</div>
							<div class="modal-body">
								<div class="form-group">
									<label>Tem certeza que deseja excluir ?</label>
								</div>
							</div>
							<div class="modal-footer">
								<div id="retorno"></div>
								<input name="idSlide" type="hidden" class="form-control" id="idSlide" value="'.$linha['id_admin_slide'].'">
								<input name="exc'.$i.'" type="hidden" class="form-control" id="exc'.$i.'" value="exc'.$i.'">
								<button name="exc'.$i.'" type="submit" class="btn btn-danger">Sim</button>
								<button type="button" class="btn btn-default" data-dismiss="modal">Não</button>
							</div>
						</div>
					</form>
				</div>
			</div>
			';
			$i++;
		}while($linha = mysqli_fetch_assoc($res));
	}		
	?>
											            
	<div class="clearfix"> </div>
</div>
<!---->
<div class="modal fade" id="modalCad" role="dialog" data-backdrop="static">
	<div class="modal-dialog container2">
		<!-- Modal content-->
		<form id="novoSlide" action="" method="post" enctype="multipart/form-data">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
					<h4 class="modal-title">Novo Slide</h4>
				</div>
				<div class="modal-body">
			  		<div class="form-group">
			        	<label for="imagemSlide">Adicionar Slide</label>
			        	<input name="imagemSlide" type="file" id="imagemSlide">
			        	<p class="help-block">Extensões permitidas: .jpeg e .png</p>
			        	<p class="help-block">Tamanho máximo: 1MB</p>
			        	<p class="help-block">É preferível que a imagem tenha boa resolução</p>
			      	</div>
			  		<div class="form-group">
			    		<label for="tituloSlide">Título</label>
			    		<input name="tituloSlide" type="text" class="form-control" id="tituloSlide" placeholder="Digite o título do Slide">
			  		</div>
			  		<div class="form-group">
			    		<label for="descrSlide">Descrição</label>
			    		<input name="descrSlide" type="text" class="form-control" id="descrSlide" placeholder="Digite uma descrição para o Slide">
			  		</div>
			  	</div>
				<div class="modal-footer">
					<div id="retorno"></div>
					<input type="hidden" name="adcSlide" value="adcSlide">
					<button name="adcSlide" type="submit" class="btn btn-success">Adicionar</button>
					<button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
				</div>
			</div>
		</form>
	</div>
</div>

 

processa.php:

Spoiler

<?php
include '../login/include/connect.php';
include "include/secure.php";
include "include/informações.php";
ini_set('default_charset','UTF-8');
mysqli_set_charset($link,'utf8');

if(isset($_POST['adcSlide'])){

	$sqlRestr	 = "SELECT titulo_slide, decricao_slide, nome_slide FROM admin_slide";
	$queryRestr  = mysqli_query($link,$sqlRestr);
	$linhasAfet	 = mysqli_num_rows($queryRestr);

	$tiposPermit = array('image/jpeg', 'image/pjpeg', 'image/png');
	$tamanho	 = (1024 * 500) * 2;
	$tituloSlide = $_POST['tituloSlide'];
	$descrSlide  = $_POST['descrSlide'];
	$arqName	 = $_FILES['imagemSlide']['name'];
	$arqType	 = $_FILES['imagemSlide']['type'];
	$arqSize	 = $_FILES['imagemSlide']['size'];
	$arqTemp	 = $_FILES['imagemSlide']['tmp_name'];
	$arqError	 = $_FILES['imagemSlide']['error'];

	if($linhasAfet >= 3){
		echo 'Só é possível cadastrar 3 slides!';
	}else if($arqError == ){
		if(!in_array($arqType, $tiposPermit)){
			echo 'O tipo de arquivo enviado é inválido!';
		}else if($tamanho < $arqSize){
			echo 'O arquivo ultrapassa o tamanho permitido!';
		}else{
			$pasta  = '../dummy/';
			$ext 	= explode('.', $arqName);
			$ext    = strtolower(end($ext));
			$nome 	= md5(time()).'.'.$ext;
			$upload = move_uploaded_file($arqTemp, $pasta . $nome);

			if($upload == true){
				$sqlSlide 	= "INSERT INTO `oficina`.`admin_slide` (`id_admin_slide`, `titulo_slide`, `decricao_slide`, `nome_slide`) VALUES (NULL, '$tituloSlide', '$descrSlide', '$nome');";
				$slideQuery = mysqli_query($link,$sqlSlide);

				if($slideQuery == false){
					echo 'Erro ao cadastrar slide';
				}else{
					echo 'Slide cadastrado com sucesso!';
				}
			}
		}
	}
}else if(isset($_POST['exc1']) || isset($_POST['exc2']) || isset($_POST['exc3'])){
	$idSlide  = $_POST['idSlide'];

	$sqlExc   = "DELETE FROM admin_slide where id_admin_slide =".$idSlide;
	$queryExc = mysqli_query($link,$sqlExc);

	$linhasAfet	 = mysqli_num_rows($queryExc);

	if($linhasAfet <= ){
		echo 'Erro ao excluir slide';
	}else{
		echo 'Slide excluido com sucesso!';
	}

}else if(isset($_POST['atz1']) || isset($_POST['atz2']) || isset($_POST['atz3'])){
	$tiposPermit = array('image/jpeg', 'image/pjpeg', 'image/png');
	$tamanho	 = (1024 * 500) * 2;
	$idSlide  	 = $_POST['idSlideA'];
	$tituloC     = $_POST['tituloSlideA'];
	$descrC   	 = $_POST['descrSlideA'];

	$arqName  = isset($_FILES['imagemSlideA']['name']);
	$arqType  = isset($_FILES['imagemSlideA']['type']);
	$arqSize  = isset($_FILES['imagemSlideA']['size']);
	$arqTemp  = isset($_FILES['imagemSlideA']['tmp_name']);
	$arqError = isset($_FILES['imagemSlideA']['error']);

	if(empty($arqName)){
		$sqlExc   = "UPDATE admin_slide SET titulo_slide = '".$tituloC."', decricao_slide = '".$descrC."' WHERE id_admin_slide = ".$idSlide.";";
		$queryExc = mysqli_query($link,$sqlExc);

		if($sqlExc == false){
			echo 'Erro ao cadastrar slide';
		}else{
			echo 'Slide atualizado com sucesso!';
		}
	}
	else if($arqError == ){
		if(!in_array($arqType, $tiposPermit)){
			echo 'O tipo de arquivo enviado é inválido!';
		}else if($tamanho < $arqSize){
			echo 'O arquivo ultrapassa o tamanho permitido!';
		}else{
			$pasta  = '../dummy/';
			$ext 	= explode('.', $arqName);
			$ext    = strtolower(end($ext));
			$nome 	= md5(time()).'.'.$ext;
			$upload = move_uploaded_file($arqTemp, $pasta . $nome);

			if($upload == true){
							
				$sqlExc   = "UPDATE admin_slide SET titulo_slide = '".$tituloC."', decricao_slide = '".$descrC."', nome_slide = '".$nome."' WHERE id_admin_slide = ".$idSlide.";";
				$queryExc = mysqli_query($link,$sqlExc);

				if($sqlExc == false){
					echo 'Erro ao cadastrar slide';
				}else{
					echo 'Slide atualizado com sucesso!';
				}
			}
		}
	}
				
}
	
?>

 

envia.js:

Spoiler

$("novoSlide").submit(function(e){
  $.ajax({
    url: "processa.php",
    type: "POST",
    data: new FormData(this),
    success: function(data){
      $("#retorno").html(data);  
    }
    processData: false,
    contentType: false
  } );
  e.preventDefault();
});

$("#editar").submit(function(){
  	var valorEdit = $(this).serialize();
 
   	$.ajax({
     	type:"POST",
     	url: "processa.php",
     	data: valorEdit,
     	success: function(data){
       		$("#retorno").html(data);  
     	}
   	});
  	return false;  
});

$("#excluir").submit(function(){
  	var valorExc = $(this).serialize();
 
   	$.ajax({
     	type:"POST",
     	url: "processa.php",
     	data: valorExc,
     	success: function(data){
       		$("#retorno").html(data);  

     	}
   	});
  	return false;  
});

 

Postado

Galera consegui resolver, existiam alguns problemas no meu código, então vamos lá...

  1. Eu estava utilizando os mesmos ID's para os formulários;
  2. Eu estava utilizando os mesmos ID's para as DIV's de retorno;

Solução:

No arquivo page_home.php, onde eu montava os formulários dinâmicos utilizei meu controlador ($i) para dar nome(ID) ao formulário, fiz o mesmo procedimento com as DIV's de retorno porém dei nomes diferentes para cada ação, por exemplo: divExc1, divExc2, divExc3, divEdt1, divEdt2.

No arquivo envia.js eu criei as funções com os nomes dos formulários: $("#excluir1"), $("#excluir2"), $("#excluir3")... Com isso tudo está funcionando perfeitamente. Como no meu caso o usuário só poderá cadastrar 3 slides então fiz dessa maneira, tenho certeza que tem outro jeito, uma maneira mais inteligente (se alguém souber não deixe de comentar :)) mas por enquanto vai assim mesmo.

 

E aproveitando vai um bônus ai, eu estava com problemas para enviar as imagens (input type=file) com o ajax então encontrei essa maneira:

$("#novoSlide").submit(function(e){

    var formData = new FormData($(this)[]);

    $.ajax({
      url: "processa.php",
      type: "POST",
      data: formData,
      success: function(data){
        $("#retorno").html(data);  
      },
      processData: false,
      contentType: false
    } );
    return false;
 });

Abraço!

Visitante
Este tópico está impedido de receber novas respostas.

Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×
×
  • Criar novo...

Ebook grátis: Aprenda a ler resistores e capacitores!

EBOOK GRÁTIS!

CLIQUE AQUI E BAIXE AGORA MESMO!