여러 Ajax 요청이 충돌합니다

Question

저는 대학에서 프로젝트를위한 웹샵을 만들고 있습니다. 머리글에 검색 표시 줄이 있고 왼쪽에 탐색 모음이 있습니다. 두 경우 모두 Ajax를 사용하여 데이터를 전송합니다 (검색 창에서 카테고리, 하위 범주의 navs에서 키워드 사용). Ajax 응답은 카테고리 및 하위 카테고리 또는 키워드를 기반으로 제품을 인쇄하는 PHP 스크립트입니다. 마지막에는 페이지 매김 링크를 인쇄하고 페이지 당 제품 수에 대한 요소를 선택합니다. 키워드를 제출하거나 탐색을 클릭하면 결과가 잘 인쇄되지만 선택한 요소 (다른 Ajax 요청)에서 페이지 나 숫자를 변경하면 범주/하위 범주 또는 키워드가 더 이상 전송되지 않기 때문에 결과가 기본값이됩니다 . 이 검색 창 요청에 대한 코드입니다

$("#searchButton").click(function(){ 
    $("#searchBar").blur(); 
    var keyword=$("#searchBar").val(); 

    $.ajax({ 
    type:"GET", 
    url:"print.php", 
    data: { keyword:keyword } 
    }).done(function (data){ 
     $('#content').html(data); 
     return false; 
    }); 
}); 

이것은 페이지 매김 코드입니다 :

$(document).on("change", "#paginationSelect", function(){ 
    var productsPerPage=$("#paginationSelect").val(); 

    $.ajax({ 
    type:"GET", 
    url:"print.php", 
    data: { productsPerPage:productsPerPage } 
    }).done(function (data){ 
     $('#content').html(data); 
     return false; 
    }); 
}); 

나는 그래서 마지막으로 Ajax 요청에 의해 전송 된 데이터를 저장하는 가장 좋은 방법은 무엇 궁금하네요 페이지 매김을 바꾸면서 다시 보낼 수 있습니다. PHP 파일 또는 Ajax 요청을 변경해야하며 최선의 방법은 무엇입니까?

편집

:

이

<?php 

error_reporting(E_ALL^E_DEPRECATED); 

mysql_connect("localhost", "root", "") or die("Couldn't connect to database."); 
mysql_select_db("webshop") or die("Couldn't select a database."); 

mysql_query("SET NAMES 'utf8'"); 
mysql_query("SET CHARACTER SET utf8"); 

if(isset($_GET["category"]) & isset($_GET["subcategory"])){ 
    $category=$_GET["category"]; 
    $subcategory=$_GET["subcategory"]; 
    $query="SELECT * from proizvod where kategorija='".$category."' and podkategorija='".$subcategory."'"; 
} 
else if(isset($_GET["keyword"])){ 
    $keyword=$_GET["keyword"]; 
    $query="SELECT * from proizvod where ime like '%".$keyword."%'"; 
} 
else{ 
    $query="SELECT * from proizvod"; 
} 

$result=mysql_query($query); 

$numProducts=mysql_num_rows($result); 
if(isset($_GET["productsPerPage"]))$productsPerPage=$_GET["productsPerPage"]; 
else if($numProducts>=10) $productsPerPage=10; 
else $productsPerPage=$numProducts; 

if(isset($_GET["pageNum"]))$pageNum=$_GET["pageNum"]; 
else $pageNum=1; 
if(isset($keyword)) print "<div id=\"keywordMessage\" class=\"col-lg-12\">Traženi pojam: ".$keyword."</div>"; 
if(mysql_num_rows($result)==0) print "<div class=\"col-lg-12\">Nema rezultata</div>"; 
for($i=0;$i<($pageNum-1)*$productsPerPage;$i++){ 
    $row=mysql_fetch_array($result, MYSQL_ASSOC); 
} 
for($i=($pageNum-1)*$productsPerPage;$i<$pageNum*$productsPerPage;$i++){ 
     $row=mysql_fetch_array($result, MYSQL_ASSOC); 
     print("<div class=\"col-lg-6\"> 
        <table class=\"article\"> 
         <tr><td colspan=\"2\"><img src=\"images/".$row["id"].".jpg\" class=\"imgArticle\"/></td></tr> 
         <tr><td colspan=\"2\"><b>".$row['ime']."</b></td></tr> 
         <tr><td>Kategorija: </td><td>".$row['kategorija']."</td></tr> 
         <tr><td>Opis: </td><td>".$row['opis']."</td></tr> 
         <tr><td>Cijena: </td><td>".$row['cijena']." kn</td></tr> 
        </table> 
       </div>"); 
} 
print("<div class=\"col-lg-12\" id=\"paginationControl\"> 
     <span class=\"col-lg-4\"> 
     Prikazano: ".(($pageNum-1)*$productsPerPage+1)."-".$pageNum*$productsPerPage."/".$numProducts." 
     </span> 
     <span class=\"col-lg-4\" id=\"pageNumbers\">"); 
if($productsPerPage!=0){ 
    for($i=1;$i<=ceil($numProducts/$productsPerPage);$i++){ 
     if($i==$pageNum) print($i." &nbsp "); 
     else print("<a class=\"pageNumControl\" href=\"#\">".$i."</a>"); 
    } 
} 
print("</span> 
     <span class=\"col-lg-4\">Proizvoda po stranici: 
      <select id=\"paginationSelect\"> 
       <option value=\"10\" "); if($productsPerPage==10){ print("selected");} print(">10</option> 
       <option value=\"20\" "); if($productsPerPage==20){ print("selected");} print(">20</option> 
       <option value=\"30\" "); if($productsPerPage==30){ print("selected");} print(">30</option> 
       <option value=\"50\" "); if($productsPerPage==50){ print("selected");} print(">50</option> 
      </select> 
      </span> 
     </div>"); 
mysql_free_result($result); 

>

Answer 1

당신은 jQuery .Data()을 사용할 수 이것은 PHP 파일입니다. 그러나 전체 페이지를 새로 고치면에 유의하십시오. .data() 정보는 손실됩니다.

그래서 더 많은 코드가 없어도 이것이 가장 좋은 예입니다. # searchBar의 데이터에 검색 정보를 저장하고 나서 페이지 매김 변경으로 검색합니다.

$("#searchButton").click(function() { 
    var $sb = $("#searchBar"), 
     keyword = $sb.val(); 

     $sb.data({ 
     prevKeyword: keyword 
     }).blur(); 

     $.ajax({ 
     type: "GET", 
     url: "print.php", 
     data: { 
      keyword: keyword 
     } 
     }).done(function(rtnData) { 
     $('#content').html(rtnData); 
     return false; 
     }); 
}); 

$(document).on("change", "#paginationSelect", function() { 
    var productsPerPage = $("#paginationSelect").val(), 
     previousKeyword = $("#searchBar").data('prevKeyword'); 

    // Do something with the keyword 
    console.log(previousKeyword); 

    $.ajax({ 
     type: "GET", 
     url: "print.php", 
     data: { 
      keyword: previousKeyword, 
      productsPerPage: productsPerPage 
     } 
    }).done(function(rtnData) { 
    $('#content').html(rtnData); 
     return false; 
    }); 
});