Data-filter não carregam seis blocos como no “TODOS”
Entrando em uma categoria não carrega seis blocos vindo do banco dedados como no "TODOS" só aqueles que ja foram carregados no todos.
Preciso que carregue igual no TODOS, a cada categoria carregue seis blocos de acordo com os blocos com as classes do $menu
Vejam aqui: somospixel.com/test
na aba portfolio.
MENU:
<div class="button-group filters-button-group listado">
<button class="button is-checked bttodos" data-filter="todos" onclick="filtrar('todos')">TODOS</button>
<button class="button btnone btc filter" data-filter="visu" onclick="filtrar('visu')">IDENTIDADE VISUAL</button>
<button class="button btnone" data-filter="web" onclick="filtrar('web')">DESENVOLVIMENTO WEB</button>
<button class="button btnone btc" data-filter="grafico" onclick="filtrar('grafico')">MATERIAL GRÁFICO</button>
<button class="button btnone" data-filter="comu" onclick="filtrar('comu')">COMUNICAÇÃO VISUAL</button>
<button class="button btnone btc" data-filter="digi" onclick="filtrar('digi')">MARKETING DIGITAL</button>
</div>
função e divs dos blocos
function pegaDados()
{
var idUltimo = $("#buttonIdUltimoItem").val();
jQuery.ajax
({
url: "pegaPortifolio.php?id="+idUltimo,
dataType: "json", //Tipo de Retorno
success:
function(data) {
console.log(data);
var pt1 = "";
var i = 1;
var ultimo_id = 0;
var size = 0, key;
for (key in data) {
if (data.hasOwnProperty(key)) size++;
}
for(i = 0; i < size; i++){
pt1 +='<div class="element-item filter filtros todos '+data[i].menu+'" data-category="transition"><div style="padding:2.5px;"><div style="border: 1px solid #AAAAAA;"><a href="#portfolioModal54" onclick="portfolioModal('+data[i].id+')" class="portfolio-link" data-toggle="modal"><img src="images/port/mini/'+data[i].imageM+'" alt="project 2"><div class="fundo-port"><h1>'+data[i].tipo+'</h1><h2>'+data[i].nome+'</h2></div></a></div></div></div>';
ultimo_id = data[i].id;
$("#buttonIdUltimoItem").val(ultimo_id);
}
monta_html(pt1);
}
});
filtrar($('#buttonIdUltimoItem').attr('class'));
}
function monta_html(dados){
$(".grid").append(dados); //joga o valor para um elemento html
}
</script>
<div class="wrap">
<div class="grid">
<?php
$servidor = 'localhost';
$banco = '###';
$usuario = '####';
$senha = '##';
$link = @mysql_connect($servidor, $usuario, $senha);
$db = mysql_select_db($banco,$link);
$idUltimoItem = 0;
if(!$link)
{
echo "erro ao conectar ao banco de dados!";exit();
}
$sql = "SELECT * FROM portfolio ORDER BY id DESC limit 6";
$query = mysql_query($sql);
while($sql = mysql_fetch_array($query)){
$id = $sql["id"];
$idUltimoItem = $id;
$nome = $sql["nome"];
$tipo = $sql["tipo"];
$desc = $sql["desc"];
$menu = $sql["menu"];
$imageM = "images/port/mini/" . $sql["imageM"];
$imageF = $sql["imageF"];
?>
<div class="element-item filter filtros todos <?php echo "$menu";?>" data-category="transition">
<div style="padding:2.5px;">
<div style="border: 1px solid #AAAAAA;">
<!--<a href="#portfolioModal54" class="portfolio-link" data-toggle="modal" id="executaAjax" value="Executa ajax">-->
<a href="#portfolioModal54" class="portfolio-link" data-toggle="modal" onclick="portfolioModal(<?php echo $id;?>)" value="Executa ajax">
<img src="<?php echo "$imageM"?>" alt="project 2">
<div class="fundo-port">
<h1><?php echo "$tipo"?></h1>
<h2><?php echo "$nome"?></h2>
</div>
</a>
</div>
</div>
</div>
<?php
}
?>
</div></div>
<!-- BOTÃO CARREGAR MAIS-->
<div id="rend-more">
<!-- <input type="hidden" value="0" id="ultimo_id"> campo oculto que armazena o valor do ultimo ID buscado no banco -->
<button type="button" id="buttonIdUltimoItem" onClick="pegaDados();" value="<?= $idUltimoItem;?>" style="width: 262px; height: 50px; border: 1px solid rgb(84, 128, 128); position: relative; top: 30%; left: 50%; transform: translateX(-50%); cursor: pointer; background-color: white;" class="todos">
<h2 style="text-align: center;color:#4d8984;font-family: 'Gotham-Thin';float: left;font-size: 25px;padding-left: 30px;padding-top: 5px;">CARREGAR</h2>
<h3 style="padding-left: 5px;float: left;font-size: 25px;color:#4d8984;font-family: 'gotham-bold';padding-top: 5px;">+</h3></button>
</div>
</div>
pegaPortifolio.php
<?php
function fn_conexao(){
$dbuser = "apixel_admin";
$dbpass = "pixel123";
try {
$pdo = new PDO('mysql:host=##;dbname=######', $dbuser, $dbpass);
$pdo -> setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_WARNING );
} catch(Exception $e) {
echo 'Erro na conexao: ' . $e->getMessage();
}
return $pdo;
}
function dados($pdo){
try {
if(!isset($_GET['id']) or $_GET['id'] == null){
$id = 0; //se o GET nao for enviado o for enviado como nullo , a variável ID pega o valor de 0
}else{
$id = $_GET['id']; //pega o valor passado via GET
}
$arr = array();
$sql = "ALTER DATABASE portfolio CHARSET = UTF8 COLLATE = utf8_general_ci";
$sql = "SELECT * FROM portfolio WHERE id < $id ORDER BY id DESC LIMIT 6";
$stmt = $pdo->prepare($sql);
$stmt->execute();
$linha = $stmt->fetchAll(PDO::FETCH_ASSOC);
if($stmt->rowCount() >= 1){
return $linha; //retorna o resultado da query
}else {
return 0;
}
} catch(Exception $e) {
print 'Erro ao inserir os dados no banco: ' . $e->getMessage();
$conexao = desconecta($conexao);
}
}
$conexao = fn_conexao();
$dados = dados($conexao);
$dados = json_encode($dados); //converte o resultado para json
print $dados; //imprime os dados na tela
?>Discussão (4)
Carregando comentários...