如何使用使用AJAX

的形式輸入不同的頁面和結果，因此，我有一個PHP網頁搜索表單（top.php），這是一個包括對網站我的工作，一個PHP的頁面，所有的mySQL的東西發生，結果存儲在一個變量和回顯（dosearch.php），最後一個PHP頁面，結果通過jQuery（search.php）顯示在div中。這是JavaScript代碼：如何使用使用AJAX

$(document).ready(function(){ 
    $('#search_button').click(function(e) { 
     e.preventDefault(); 
     var searchVal = $('#search_term').attr('value'); 
     var categoryVal = $('#category').attr('value'); 
     $.ajax({ 
      type: 'POST', 
      url: 'dosearch.php', 
      data: "search_term=" + searchVal + "&category=" + categoryVal, 
      beforeSend: function() { 
       $('#results_cont').html(''); 
       $('#loader').html('<img src="layout/ajax-loader.gif" alt="Searching..." />'); 
       if(!searchVal[0]) { 
        $('#loader').html(''); 
        $('#results_cont').html('No input...');  
        return false; 
       } 
      }, 
      success: function(response) { 
       $('#loader').html(''); 
       $('#results_cont').html(response); 
      } 
     }); 
    }); 
});

的#search_term和#category字段是top.php，其他的div（#loader和#results_cont）是search.php中。我將如何通過以使表單提交併顯示search.php中的結果從top.php中沒有問題？它完美的工作，如果窗體和JavaScript在search.php，但我似乎無法分開這些，並使其工作。我究竟做錯了什麼？

PS。對不起，如果我不夠清楚，在工作中，真的很累。 :(

來源

2011-02-10 Alex Berg

分裂：

<? include('functions-or-classes.php'); ?> 

    <!DOCTYPE html> 
    <html> 
     <head> 
     <title></title> 

     <? include('js-script.php'); ?> 

     </head> 
     <body> 

     <? include('results-div.php'); ?> 

      <? include('search-form.php'); ?> 

     </body> 
    </html>

你應該尊重這個命令，然後你可以將代碼拆分成不同的部分並將它包含到你的主php文件中;

PS：peraphs你的代碼應該是這樣的：

<!DOCTYPE html> 
<html> 
    <head> 
    <title></title> 
    <script> 
$(function() { 
    $('#search-form').submit(function(e) { 
     e.preventDefault(); 
     var searchVal = $('#search_term').val(); 
     var query = $(this).serialize(); // search_term=lorem&category=foo 
     if (!searchVal) { 
      $('#results_cont').html('No input...'); 
     } else { 
      $('#results_cont').html('<div id="loader">'+ 
       '<img src="layout/ajax-loader.gif" alt="" /><div>'); 
      $.ajax({ 
       type: 'POST', 
       url: 'dosearch.php', 
       data: query, 
       success: function(response) { 
        $('#results_cont').html(response); 
       } 
      }); 
     } 
    }); 
}); 
    </script> 
    </head> 
    <body> 
    <form id="search-form"> 
     <input type="text" id="search_term" name="search_term" /> 
     <select id="category" name="category"> 
     <option value="foo">foo</option> 
     <option value="bar">bar</option> 
     </select> 
     <input type="submit" name="search_button" /> 
    </form> 
    <div id="results_cont"></div> 
    </body> 
</html>

來源

2011-02-10 13:56:09

，你可以讓你的search_button重定向到您的search.php的做工作時的頁面，而不是被裝載做它的點擊事件。

和搜索頁面

上使用$_GET['Search']和您的網址應該是這樣的

/search.php?Search=1337

來源

2011-02-10 13:53:46 Kimtho6

是啊，但是如果他已經在結果頁面上？那不是說整個頁面會重新加載嗎？ – 2011-02-10 13:56:11

是的，但是真的有問題嗎？ – Kimtho6 2011-02-10 13:57:06

如何使用使用AJAX

回答

相關問題