2011-07-09 182 views
1

名單我有以下代碼:排序而無需刷新頁面

<table border="0" width="100%"><tbody> 
    <tr> 
     <th style="text-align: center;"><?php echo $text['PLAYERS']; ?></th> 
    </tr> 
    <tr> 
     <td> 
     <select name="order" size="1" onchange="sortPlayers(this)"> 
      <option value="name"><?php echo $text['NAME']; ?></option> 
      <option value="age"><?php echo $text['AGE']; ?></option> 
      <option value="ss"><?php echo $text['SS']; ?></option> 
      <option value="experience"><?php echo $text['EXPERIENCE']; ?></option> 
      <option value="leadership"><?php echo $text['LEADERSHIP']; ?></option>    
      <option value="weight"><?php echo $text['WEIGHT']; ?></option>    
      <option value="height"><?php echo $text['HEIGHT']; ?></option>  
      <option value="stamina"><?php echo $text['STAMINA']; ?></option>    
      <option value="strength"><?php echo $text['STRENGTH']; ?></option>    
      <option value="breakthroughs"><?php echo $text['BREAKTHROUGHS']; ?></option> 
      <option value="tackling"><?php echo $text['TACKLING']; ?></option> 
      <option value="handling"><?php echo $text['HANDLING']; ?></option>    
      <option value="speed"><?php echo $text['SPEED']; ?></option> 
      <option value="kicking"><?php echo $text['KICKING']; ?></option> 
     </select> 
     </td> 
    </tr> 
    <?php foreach ($result as $player) { ?> 
    <tr> 
     <td style="text-align: left;"><?php echo $player['male'] . ' ' . $player['name']; ?></td> 
    </tr> 
    <?php } ?> 
    </tbody></table> 

它產生與每一個用戶的玩家在網絡遊戲的列表。 我希望當用戶從下拉菜單中選擇一些東西時,玩家會根據選擇的內容(力量,速度等)進行排序。 我有一個函數讓玩家:get_players($ tid,$ sort)。 $ tid =用戶標識 $ sort =排序標準(速度,踢等)。

什麼是JavaScript代碼以獲取該輸入中選定的內容,並根據該輸入中的選擇更改變量$ result,但不刷新頁面。

回答

1

如果我正確理解了慾望,您希望觀衆能夠選擇一個選項(姓名,年齡,ss,經驗等等),然後根據選擇的屬性顯示不同的排序結果你想在不刷新頁面的情況下做到這一點。

從設計角度來看,您有兩種方法可行。您可以在初始頁面(在Javascript數據結構中)包含所有選擇的所有可能數據。然後,這只是一些javascript代碼的問題,可以從數據結構中獲取正確的數據,對其進行排序並將其插入到DOM中進行顯示。或者,如果您不預先包含所有數據,則必須進行ajax調用以獲取所需的數據,對其進行排序,然後將其插入到DOM中。您現在在代碼中顯示的PHP看起來只包含了玩家的名字。

走哪條路真的取決於數據的規模。如果它是可管理的(從生成頁面和瀏覽器內存消費的角度來看)只包含原始頁面中的所有數據,那麼編碼更容易。但是,你必須看看你最大的玩家數量,你支持的屬性的最大數量。如果這是不可管理的,那麼您將需要支持可以返回已選擇的給定屬性的JSON數據的ajax調用。

+0

你也可以處理所有的排序VIA ajax調用,並讓AJAX調用返回整個表,然後讓JS函數完全覆蓋表。這將完全消除對JSON的任何需求,並且您需要做的就是回顯ajax調用的整個返回值。 –