2017-04-03 66 views
0

我有一個頁面index.php 它的內部是一個好友名單,它通過點擊按鈕來更新數據庫而無需刷新頁面。現在我想,只有好友列表refreshs因此其更新刷新包含頁面

<html> 
<body> 
<?php 
      include ("friendlist.php"); 
?> 
</body> 
</html> 

friendlist.php:

<script> 
function adduser() { 

    var data=$("#adduserform").serialize(); 
       $.ajax({ 
        type: "POST", 
        url: "addfriend.php", 
        data: data, 
        dataType: "html", 
        success: function(data) 
      { 
       //refresh myFriendlist or requser so its updated 
      } 
       }); 
} 


</script> 

<div id="myFriendlist" class="friendlist-content"> 
    <?php if(!empty($request)) { ?> 
    <div id="req"> 
    <h2 id="reqh">Anfragen</h2> 
    <?php foreach($request as $row) { 
    $row['userAname'] = (strlen($row['userAname']) > 5) ? substr($row['userAname'], 0, 5) . '...' : $row['userAname']; 
    ?> 
    <div id="requser"> 
     <a class="reqimg" style="padding:0px;" href="user.php?id=<?php echo ($row['id']);?>"> 
      <img class="reqpb" src="./users/<?php echo ($row['userAid']); ?>/pb.jpg" alt="Bild nicht gefunden" onerror="this.src='./img/no_pb.png';"></img> 
     </a> 
     <a class="reqnm" style="padding:0px;" href="user.php?id=<?php echo ($row['userAid']);?>"><?php echo $row['userAname']; ?></a> 

     <a href="javascript:adduser();" id="accept" title="Aktzeptieren"><img id="aimg" src="./img/accepticon.png"></a> 
     <form id="adduserform" name="adduserform"> 
       <input type="hidden" id="reqid" name="reqid" value="<?php echo $row['userAid'];?>" /> 
       <input type="hidden" id="reqnm" name="reqnm" value="<?php echo $row['userAname'];?>" /> 
     </form> 

     <a href="javascript:rejectuser();" id="dntacpt" title="Ablehnen"><img id="aimg" src="./img/dntaccepticon.png"></a> 

    </div> 
    <?php 
     } 
    ?> 
    </div> 
    <?php 
    } 
    ?> 

</div> 

我怎麼能這樣做?

回答

0

您可以使用ajax刷新外部文件。例如,如果你有id爲「friendslist」一個div你可以刷新它的內容是這樣的:

$.ajax({ 
    url: "friendlist.php" 
}).done(function(response) { 
    $('#friendslist').html(response); 
}); 

適合於Ajax的文件是在jQuery的網站在這裏:http://api.jquery.com/jquery.ajax/

0

如果你可以讓「addfriend.php」返回用戶的新的完整列表,所以這將是:

<?php foreach($request as $row) { $row['userAname'] = (strlen($row['userAname']) > 5) ? substr($row['userAname'], 0, 5) . '...' : $row['userAname']; ?>

,你可以使用該響應,當你做你會收到AJAX調用,刷新好友列表,使用jQuery HTML功能(http://api.jquery.com/html/

0

你可以按照這個代碼,但沒有測試

首先更新的index.php

<html> 
<body> 
<div id="friendlist"> 
<?php 
     include ("friendlist.php"); 
?> 
</div> 
</body> 
</html> 

然後更新您的addfriend.php像

<?php 

// your code here 

// then include your frindlist.php content 
include 'yourpath/frindlist.php' 
?> 

那麼這樣

function adduser() { 
var data=$("#adduserform").serialize(); 
      $.ajax({ 
       type: "POST", 
       url: "addfriend.php", 
       data: data, 
       dataType: "html", 
       success: function(data) 
     { 
      $('#friendlist').html(data); 
     } 
     }); 
    } 
更新JavaScript代碼