PHP MySQL的＆AJAX搜索過濾器的時間延遲

Question

這是我第一次在PHP和JavaScript的工作......你需要在固定的東西幫助。

我的網站必須在頭一個搜索框，當搜索詞被提交它去持有一個過濾器菜單和搜索結果的search.php。篩選器菜單基於少數選擇列表。只要在過濾器菜單中點擊任何選項，它就會更新搜索結果。

爲了這個，我使用的是從另一個PHP文件「SearchResult.php」調用數據更新與ID #Result一個div一個JavaScript。

問題： 它在本地主機運行完美然而，當在線它會導致更新搜索結果中的延遲。

幫助： 有沒有什麼方法可以顯示某種加載方式，讓觀衆瞭解，或者無論如何都可以讓它變得更快。

這裏是我的代碼：

的Java腳本函數

function get() 
{ 
    $('#Search_Results').hide(); 
    $.post('SearchResults.php', { Search: form.Search.value, cat: form.category.value, brand: form.brand.value }, 
    function(output) 
     { 
      $('#Search_Results').html(output).show(); 
     } 
) 
} 

搜索過濾器FORM

enter code hereif(!empty($_REQUEST['Search'])){ 
$SearchTerm = $_REQUEST['Search']; 
} else { 
    $SearchTerm = ''; 
} 
// Search term submited 
echo '<input name="Search" type="hidden" value="'.$SearchTerm.'" />'; 
$sql = mysql_query ("SELECT * FROM categories"); 
echo '<h4>Filter Categories</h4><select name="cat" onChange="get();" size="15">'; 
echo '<option value="" class="Select_Options">All Categories</option>'; 
    while ($row = mysql_fetch_array($sql)) 
     { 
      echo '<option class="Select_Options" value="' . $row["CategoryID"] . '">' . $row["CategoryName"] . '</option>'; 
    } 
echo '</select>'; 
//Few more such filters 

---

搜索結果頁面

if(!empty($_REQUEST['Search'])){ 
$SearchTerm = $_REQUEST['Search']; 
} 
else { 
echo 'Please enter search keyword(s)'; 
exit(); 
} 
if(!empty($_REQUEST['cat'])){ 
$cat = $_REQUEST['cat']; 
$SearchQuery .= " AND categories.CategoryID = '$cat'"; 
} 

if(!empty($_REQUEST['brand'])){ 
$brand = $_REQUEST['brand']; 
$SearchQuery .= " AND brands.BrandID = '$brand'"; 
} 

$sql = "SELECT DISTINCT products.ProductID, ProductKeywords, products.SectionID, products.ProductThumb, products.ProductPrice, products.CategoryID, products.SubCategoryID, products.BrandID, brands.BrandLogo, ProductTitle AS title FROM products 
    INNER JOIN brands ON products.BrandID = brands.BrandID 
    INNER JOIN sections ON products.SectionID = sections.SectionID 
    INNER JOIN categories ON products.CategoryID = categories.CategoryID 
    INNER JOIN subcategory ON products.SubCategoryID = subcategory.SubCatID $ColorJoin 
    WHERE MATCH (ProductKeywords) AGAINST ('$SearchTerm*' in boolean mode)$SearchQuery"; 

$query = mysql_query($sql); 
echo '<div id="Product_Search_Container"><ul>'; 
while ($row = mysql_fetch_array($query)) 
{ 

    $ProductID = $row["ProductID"];  
    $sql2 = mysql_query ("SELECT COUNT(ProColorID) AS ProductCount FROM productcolors WHERE ProductID = '$ProductID'");  
      while ($row5 = mysql_fetch_array($sql2)) 
      { 
       $BrandID = $row["BrandID"]; 
       $sql3 = mysql_query ("SELECT * FROM brands WHERE BrandID = '$BrandID'");   
       while ($row6 = mysql_fetch_array($sql3)) 
       { 
        $ProductThumb = $row["ProductThumb"]; 
        if ($ProductThumb == NULL) { $ProductThumb = "No_Image.jpg"; } 

      echo '<li><img src="images/Products/Thumbs/' . $ProductThumb . '" width="210px" height="275px" /> 
        <div class="zoomer"><span class="zoom'; 
        if ($ProductThumb != "No_Image.jpg") { 
         echo ' cursonstyle" style="position: relative; overflow: hidden;"><img src="images/Products/Thumbs/zoom/' . $ProductThumb . '" alt="' . $row["title"] . '" /> 
        '; } else { echo '">'; } 
        echo '</span><span class="Pro_Title">' . $row["title"] . '</span> 
        <span class="BrandLogo"><img src="images/Brands/' . $row6["BrandLogo"] . '" /></span> 
        <span class="ProColors">' . $row5["ProductCount"] . ' Colors</span> 
        <span class="ProPrice">$' . $row["ProductPrice"] . '</span> 
        <a href="?Product=' . $row["ProductID"] . '" class="viewdetails">&nbsp;</a></a></li>'; 

       }       
      } 
} 

     echo '</ul></div>'; 

Answer 1

您可以顯示加載消息，只要您在啓動發佈請求並將其隱藏在回調中時顯示即可。

function get() 
{ 
    $('#Search_Results').hide(); 
    $('#loading').show().html('Please wait while loading..'); // <-- show message on function call 
    $.post('SearchResults.php', { Search: form.Search.value, cat: form.category.value, brand: form.brand.value }, 
    function(output) 
     { 
      $('#loading').hide(); // <-- hide in callback function 
      $('#Search_Results').html(output).show(); 
     } 
) 
} 

你也應該處理錯誤在你的Ajax請求，並考慮準備的語句或至少使用mysql_real_escape_string()所有的用戶輸入。