php / AJAX - 分页错误

时间:2018-03-03 17:51:00

标签: php ajax

当我点击computadores.php文件中的一个或多个标签时,我使用AJAX从查询中获取结果。结果伴随着分页。但是,当我点击第2页(或更多)时,它不会呈现任何东西。分页仅显示第1页的结果。查询返回结果,但分页存在错误,其中未显示第1页以外的结果。当我“检查”文件时,它表示代码没有错误,所以我没有想法它是什么。

computeadores.php文件

<ul id="paramount">

</ul>
<ul id="filtpesq">

    <li>PESQUISA<br>
        <span>Filtros</span>

        <ul><div class="t">Preço</div><div id="compind1" class="incount t"></div>
            <input id="preco" type="hidden" name="preco" value='1 AND 5000'>
            <li class="input">
                <input id="op1i" class="css-checkbox" type="checkbox" value="201 AND 400" data-compind1="1" data-compactiv1="no"/>
                <label id="op1" class="comppreco css-label" for="op1i">€201 - €400</label>
            </li>
            <li class="input">
                <input id="op2i" class="css-checkbox" type="checkbox" value="401 AND 600" data-compind1="2" data-compactiv1="no"/>
                <label id="op2" class="comppreco css-label" for="op2i">€401 - €600</label>
            </li>
            <li class="input">
                <input id="op3i" class="css-checkbox" type="checkbox" value="601 AND 800" data-compind1="3" data-compactiv1="no"/>
                <label id="op3" class="comppreco css-label" for="op3i">€601 - €800</label>
            </li>   
            <li class="input">
                <input id="op4i" class="css-checkbox" type="checkbox" value="801 AND 1000" data-compind1="4" data-compactiv1="no"/>
                <label id="op4" class="comppreco css-label" for="op4i">€801 - €1000</label>
            </li>
            <li class="input">
                <input id="op5i" class="css-checkbox" type="checkbox" value="1001 AND 1500" data-compind1="5" data-compactiv1="no"/>
                <label id="op5" class="comppreco css-label" for="op5i">€1001 - €1500</label>
            </li>
            <li class="input">
                <input id="op6i" class="css-checkbox" type="checkbox" value="1501 AND 2000" data-compind1="6" data-compactiv1="no"/>
                <label id="op6" class="comppreco css-label" for="op6i">€1501 - €2000</label>
            </li>
            <li class="input">
                <input id="op7i" class="css-checkbox" type="checkbox" value="2001 AND 2500" data-compind1="7" data-compactiv1="no"/>
                <label id="op7" class="comppreco css-label" for="op7i">€2001 - €2500</label>
            </li>
            <li class="input">
                <input id="op8i" class="css-checkbox" type="checkbox" value="2501 AND 5000" data-compind1="8" data-compactiv1="no"/>
                <label id="op8" class="comppreco css-label" for="op8i">€2501 - €5000</label>
            </li>   
        </ul>
    </li>
    <li>
        <ul>
            <div class="t">Velocidade</div><div id="compind2" class="incount t"></div>
            <input id="process" type="hidden" name="process" value='1 AND 4.2'>
            <li class="input">
                <input id="op9i" class="css-checkbox" type="checkbox" value="1.50 AND 2.00" data-compind2="1" data-compactiv2="no"/>
                <label id="op9" class="compprocess css-label" for="op9i">1.5 GHz - 2 GHz</label>
            </li>
            <li class="input">  
                <input id="op10i" class="css-checkbox" type="checkbox" value="2.50 AND 3.00" data-compind2="2" data-compactiv2="no"/>
                <label id="op10" class="compprocess css-label" for="op10i">2.5 GHz - 3 GHz</label>
            </li>
            <li class="input">
                <input id="op11i" class="css-checkbox" type="checkbox" value="3.10 AND 3.50" data-compind2="3" data-compactiv2="no"/>
                <label id="op11" class="compprocess css-label" for="op11i">3.1 GHz - 3.5 GHz</label>
            </li>   
            <li class="input">
                <input id="op12i" class="css-checkbox" type="checkbox" value="3.60 AND 3.90" data-compind2="4" data-compactiv2="no"/>
                <label id="op12" class="compprocess css-label" for="op12i">3.6 GHz - 3.9 GHz</label>
            </li>
            <li class="input">
                <input id="op13i" class="css-checkbox" type="checkbox" value="4.00 AND 4.20" data-compind2="5" data-compactiv2="no"/>
                <label id="op13" class="compprocess css-label" for="op13i">4 GHz - 4.2 GHz</label>
            </li>
        </ul>
    </li>
    <li>
        <ul>
            <div class="t">Ram</div><div id="compind3" class="incount t"></div>
            <input id="ram" type="hidden" name="ram" value='1 AND 2256'>
            <li class="input">
                <input id="op20i" class="css-checkbox" type="checkbox" value="2 AND 2" data-compind3="1" data-compactiv3="no"/>
                <label id="op20" class="compram css-label" for="op20i">2 GB</label>
            </li>
            <li class="input">
                <input id="op21i" class="css-checkbox" type="checkbox" value="4 AND 4" data-compind3="2" data-compactiv3="no"/>
                <label id="op21" class="compram css-label" for="op21i">4 GB</label>
            </li>
            <li class="input">
                <input id="op22i" class="css-checkbox" type="checkbox" value="8 AND 8" data-compind3="3" data-compactiv3="no"/>
                <label id="op22" class="compram css-label" for="op22i">8 GB</label>
            </li>   
            <li class="input">
                <input id="op23i" class="css-checkbox" type="checkbox" value="12 AND 12" data-compind3="4" data-compactiv3="no"/>
                <label id="op23" class="compram css-label" for="op23i">12 GB</label>
            </li>
            <li class="input">
                <input id="op24i" class="css-checkbox" type="checkbox" value="16 AND 16" data-compind3="5" data-compactiv3="no"/>
                <label id="op24" class="compram css-label" for="op24i">16 GB</label>
            </li>
            <li class="input">
                <input id="op25i" class="css-checkbox" type="checkbox" value="32 AND 32" data-compind3="6" data-compactiv3="no"/>
                <label id="op25" class="compram css-label" for="op25i">32 GB</label>
            </li>
            <li class="input">
                <input id="op26i" class="css-checkbox" type="checkbox" value="64 AND 64" data-compind3="7" data-compactiv3="no"/>
                <label id="op26" class="compram css-label" for="op26i">64 GB</label>
            </li>
        </ul>
    </li>
    <li>
        <ul>
            <div class="t">Disco</div><div id="compind4" class="incount t"></div>
            <input id="disco" type="hidden" name="disco" value='1 AND 2512'>
            <li class="input">
                <input id="op27i" class="css-checkbox" type="checkbox" value="256 AND 256" data-compind4="1" data-compactiv4="no"/>
                <label id="op27" class="compdisco css-label" for="op27i">256 GB</label>
            </li>
            <li class="input">  
                <input id="op28i" class="css-checkbox" type="checkbox" value="500 AND 500" data-compind4="2" data-compactiv4="no"/>
                <label id="op28" class="compdisco css-label" for="op28i">500 GB</label>
            </li>
            <li class="input">
                <input id="op29i" class="css-checkbox" type="checkbox" value="1000 AND 1000" data-compind4="3" data-compactiv4="no"/>
                <label id="op29" class="compdisco css-label" for="op29i">1 TB</label>
            </li>   
            <li class="input">
                <input id="op30i" class="css-checkbox" type="checkbox" value="1120 AND 1120" data-compind4="4" data-compactiv4="no"/>
                <label id="op30" class="compdisco css-label" for="op30i">1 TB + 120 GB</label>
            </li>
            <li class="input">
                <input id="op31i" class="css-checkbox" type="checkbox" value="1128 AND 1128" data-compind4="5" data-compactiv4="no"/>
                <label id="op31" class="compdisco css-label" for="op31i">1 TB + 128 GB</label>
            </li>
            <li class="input">
                <input id="op32i" class="css-checkbox" type="checkbox" value="1256 AND 1256" data-compind4="6" data-compactiv4="no"/>
                <label id="op32" class="compdisco css-label" for="op32i">1 TB + 256 GB</label>
            </li>
            <li class="input">
                <input id="op33i" class="css-checkbox" type="checkbox" value="2256 AND 2256" data-compind4="7" data-compactiv4="no"/>
                <label id="op33" class="compdisco css-label" for="op33i">2 TB + 256 GB</label>
            </li>
        </ul>
    </li>
</ul>

JS.js文件

var inpreco=["","","","","","","","","","","",""];
var altpreco=["","","","","","","","","","","",""];
var inprocess=["","","","","","","","","","","",""];
var altprocess=["","","","","","","","","","","",""];
var inpram=["","","","","","","","","","","",""];
var altram=["","","","","","","","","","","",""];
var inpdisco=["","","","","","","","","","","",""];
var altdisco=["","","","","","","","","","","",""];
var compcount1=0;
var compcount2=0;
var compcount3=0;
var compcount4=0;

$(".comppreco").click(function(){compcount1=SuperFun(this,"#preco",inpreco,altpreco,"compind1","compactiv1",compcount1,"preco","1 AND 5000","listacomput.php",
"preco","process","ram","disco","preco","preco","preco");});

$(".compprocess").click(function(){compcount2=SuperFun(this, "#process",inprocess,altprocess,"compind2","compactiv2",compcount2,"processador_id","1 AND 16", 
"listacomput.php","preco","process","ram","disco","preco","preco","preco");});

$(".compram").click(function(){compcount3=SuperFun(this,"#ram",inpram,altram,"compind3","compactiv3",compcount3,"RAM","1 AND 64","listacomput.php", "preco",
"process","ram","disco","preco","preco","preco");});

$(".compdisco").click(function(){compcount4=SuperFun(this,"#disco",inpdisco,altdisco,"compind4","compactiv4",compcount4,"disco","1 AND 2256","listacomput.php","preco","process","ram","disco","preco","preco","preco");});

function SuperFun(element,input,inpArray,secArray,secIndex,inpActive,counter,msqlip,ending,ajax,input1,input2,input3,input4,input5,input6,input7){
var inpValue=$("#"+element.id+"i").val();
var sIndex=$("#"+element.id+"i").data(secIndex);
var inpa=$("#"+element.id+"i").data(inpActive);
var secArray2=secArray.filter(Boolean);
if (counter==0){
  counter++;
  $("#"+element.id+"i").data(inpActive, "primary");
  inpArray[0]=(inpValue);  
}else
if (inpa=="no") {
  counter++;
  $("#"+element.id+"i").data(inpActive, "yes");
  inpArray[sIndex]=(" OR "+msqlip+" BETWEEN "+inpValue);
  secArray[sIndex]=(sIndex);
}else
if (inpa=="yes") {
  counter--;
  $("#"+element.id+"i").data(inpActive, "no");
  inpArray[sIndex]="";
  secArray[sIndex]="";
}else
if (inpa=="primary" && counter!==1) {
  counter--;
  $("#"+element.id+"i").data(inpActive, "no");
  inpArray[0]=$("input[data-"+secIndex+"*="+secArray2[0]+"]").val();
  inpArray[$("input[data-"+secIndex+"*="+secArray2[0]+"]").data(secIndex)]="";
  $("input[data-"+secIndex+"*="+secArray2[0]+"]").data(inpActive, "primary")
  secArray[$("input[data-"+secIndex+"*="+secArray2[0]+"]").data(secIndex)]="";    
} else
if (inpa=="primary" && counter==1) {
  counter--;
  $("#"+element.id+"i").data(inpActive, "no");
  inpArray[sIndex]="";
  inpArray[0]=ending;   
}
$(input).val(inpArray[0]+inpArray[1]+inpArray[2]+inpArray[3]+inpArray[4]+inpArray[5]+inpArray[6]+inpArray[7]+inpArray[8]+inpArray[9]+inpArray[10]+
  inpArray[11]);
$.post(ajax+"?"+input1+"="+$("#"+input1).val()+"&"+input2+"="+$("#"+input2).val()+"&"+input3+"="+$("#"+input3).val()+"&"+input4+"="+$("#"+input4).val()+
"&"+input5+"="+$("#"+input5).val()+"&"+input6+"="+$("#"+input6).val()+"&"+input7+"="+$("#"+input7).val(), function(data) {
  $("#paramount").html(data);
});
if (counter==0) {
  $("#"+secIndex).html("");  
}else {
  $("#"+secIndex).html(counter);
}
return counter;
};

listacomp.php文件(AJAX文件):

$pagina=1;
if (empty($_GET["pagina"]) || $_GET["pagina"] < 1) {$pagina = 1;}else 
{$pagina = intval($_GET["pagina"]);}
$quantidade = 3;
$offset = ($pagina - 1) * $quantidade;
$preco=mysqli_real_escape_string($conn, $_GET["preco"]);
$process=mysqli_real_escape_string($conn, $_GET["process"]);
$ram=mysqli_real_escape_string($conn, $_GET["ram"]);
$disco=mysqli_real_escape_string($conn, $_GET["disco"]);
$sql = "SELECT SQL_CALC_FOUND_ROWS computadores.id, computadores.nome, computadores.preco, processadores.velocidade AS velocidade, computadores.RAM, computadores.disco FROM computadores LEFT JOIN processadores ON computadores.processador_id=processadores.id WHERE (preco BETWEEN $preco) AND (processadores.velocidade BETWEEN $process) AND (RAM BETWEEN $ram) AND (disco BETWEEN $disco) LIMIT $offset,$quantidade";
$result = mysqli_query($conn, $sql);
echo mysqli_error($conn);
$sql = "SELECT FOUND_ROWS()";
$contagem = mysqli_query($conn, $sql);
$total_resultados = mysqli_fetch_row($contagem);
$total_resultados = $total_resultados[0];
$ultima_pagina = ceil($total_resultados / $quantidade);
$link = "&quantidade=$quantidade";
if (mysqli_num_rows($result)>0) {
$row = mysqli_fetch_assoc($result);
if (mysqli_num_rows($result) > 1) {echo mysqli_num_rows($result) . " computadores<br>";}
    elseif (mysqli_num_rows($result) == 1) {echo mysqli_num_rows($result) . " computador<br>";}
    do {
        echo "
            <li class='entrada'>
                <img src='imagens/computadores/$row[id].JPG'>
                <div class='entradanome'>$row[nome]</div>
                <div class='entradacarac'>
                    Velocidade: $row[velocidade] GHz<br>
                    RAM: $row[RAM] GB<br>
                    Disco: $row[disco] GB
                </div>
                <div class='entradapreco'>$row[preco]€</div>
            </li>";
    }
    while($row = mysqli_fetch_array($result));
    echo "<div class='ajpaginacao'>";
    if ($pagina > 1) {
        echo "<a href='?pagina=" . ($pagina - 1) . "$link'><span >&lt;</a>";
    }else {
        echo "<span>&lt;</span>";
    }
    for ($i = 1; $i <= $ultima_pagina; $i++){
        if ($i == $pagina) {
            echo "<span class=\"active\">$i</span>";
        }else {
            echo "<a href='?pagina=$i$link'>$i</a>";
        }
    }
    if ($pagina < $ultima_pagina) {echo "<a href='?pagina=" . ($pagina + 1) . "$link'>&gt;</a>";}else {echo "<span>&gt;</span>";}
    echo "</div>";
}else {
    echo "";
}

1 个答案:

答案 0 :(得分:0)

我得到了分页工作。但是我必须在JS文件中创建另一个函数来改变页面,使用ajax文件中的data-atribute来识别每个页面。