2013-08-14 2 views
0
<?php 
session_start(); 
if(!$_SESSION['Admin']) { 
header('Location: login.php'); exit(); 
} 
?> 
<!DOCTYPE HTML> 
<html> 
<head> 
    <title> ticketExpress | Admin </title> 
    <link rel='stylesheet' href='../assets/css/style.css'> 
</head> 
<body> 
<div id='containerAdmin'> 
<h1> <img class='logo' src='../assets/images/logo.png' width='200' height='43'> </h1> <a href='?logout' class='logout'> Logout </a> 
<h3> Open Tickets </h3> 
<hr /> 
<?php 
require("../configuration/config.php"); 
$GetTickets = $con->query("SELECT * FROM tickets WHERE open='true'"); 
while($TicketInfo = $GetTickets->fetch_object()) { 
$Subject = $TicketInfo->Subject; 
echo "<div id='ticket'>".$Subject ."<a href='?delete=$TicketInfo->ID'><img style='float:right'src='../assets/images/delete.png' width='15px' height='15px'></a><a style='float:right; color:red; text-decoration:none; margin-right:10px;' href='?close=$TicketInfo->ID'> Close </a><font style='float:right; margin-right:10px; color:green;' id='responseMsg'> </font></div>"; 
} 
if(isset($_GET['delete'])) { 
$ID = $_GET['delete']; 
echo " 
<script type='text/javascript'> 
    var ajax = new XMLHttpRequest(); 
    ajax.open('POST','delete.php', true); 
    ajax.setRequestHeader('Content-type','application/x-www-form-urlencoded'); 
    ajax.onreadystatechange = function() { 
     if(ajax.readyState == 4 && ajax.status == 200) { 
      document.getElementById('responseMsg').innerHTML = ajax.responseText; 
     } 
     } 
     ajax.send('delete=$ID'); 
    </script> 
    "; 
} 
if(isset($_GET['logout'])) { 
session_destroy(); 
header('Location: login.php'); 
} 
if(isset($_GET['close'])) { 
$ID = $_GET['close']; 
echo " 
<script type='text/javascript'> 
    var ajax = new XMLHttpRequest(); 
    ajax.open('POST','close.php', true); 
    ajax.setRequestHeader('Content-type','application/x-www-form-urlencoded'); 
    ajax.onreadystatechange = function() { 
     if(ajax.readyState == 4 && ajax.status == 200) { 
      document.getElementById('responseMsg').innerHTML = ajax.responseText; 
     } 
     } 
     ajax.send('close=$ID'); 
    </script> 
    "; 
} 
?> 
<br /> 
</div> 
</body> 
</html> 

내 문제는 내가 삭제 클릭 할 때마다 내가 예를 들어 "닫기"를 클릭하면, 아약스 응답이 항상 페이지 (상단 하나)아약스 응답 메시지 고유 식별자

에 다음 첫 번째 표에 나타납니다입니다 다음 표 21, Ajax 응답 "티켓들을 성공적 닫힘"항상 여기

(예를 들어, 표 1) 페이지에 다음 첫 번째 표에 나타납니다 것은

<?php 
require('../configuration/config.php'); 
if(isset($_POST['close'])) { 
echo "Ticket Successfully Closed"; 
$TID = $_POST['close']; 
$con->query("UPDATE tickets SET open='false' WHERE ID='$TID'"); 
} 

close.php입니다 d delete.php

<?php 
require('../configuration/config.php'); 
if(isset($_POST['delete'])) { 
echo "Ticket Deleted"; 
$TID = $_POST['delete']; 
$con->query("DELETE FROM tickets WHERE ID='$TID'"); 
} 

항상 모든 답변을드립니다! 미리 감사드립니다.

답변

0

동일한 ID를 가진 DOM 요소가 여러 개 있습니다. while 루프를 확인하십시오.

코드 document.getElementById('responseMsg')은 항상 DOM에있는 첫 번째 요소를 가져옵니다. 동일한 DOM ID로 여러 티켓을 표시하고 있습니다.

서버 응답을 표시하려는 요소에 고유 한 식별자를 추가해야합니다. 이 라인에서

봐 :

echo "<div id='ticket'>".$Subject ."<a href='?delete=$TicketInfo->ID'><img style='float:right'src='../assets/images/delete.png' width='15px' height='15px'></a><a style='float:right; color:red; text-decoration:none; margin-right:10px;' href='?close=$TicketInfo->ID'> Close </a><font style='float:right; margin-right:10px; color:green;' id='responseMsg'> </font></div>"; 

당신은 id='responseMsg'id='responseMsg{$TicketInfo->ID}'에를 변경 한 다음 바로 하나 "responseMsg"요소를 대상으로 자바 스크립트 함수에서 매개 변수로이 티켓 ID를 보낼 수 있습니다.

예.

echo "<div id='ticket{$TicketInfo->ID}'>". $Subject ."<a href='#' onclick='deleteTicket({$TicketInfo->ID});'><img src="..."></a> <a style='float:right; color:red; text-decoration:none; margin-right:10px;' href='#' onclick='closeTicket({$TicketInfo->ID});'> Close </a><span style='float:right; margin-right:10px; color:green;' id='responseMsg{$TicketInfo->ID}'> </span></div>"; 

<script type='text/javascript'> 
function deleteTicket(ticketID) { 
    var ajax = new XMLHttpRequest(); 
    ajax.open('POST','delete.php', true); 
    ajax.setRequestHeader('Content-type','application/x-www-form-urlencoded'); 
    ajax.onreadystatechange = function() { 
    if(ajax.readyState == 4 && ajax.status == 200) { 
     document.getElementById('responseMsg'+ticketID).innerHTML = ajax.responseText; 
    } 
    } 
    ajax.send('delete='+ticketID); 
} 
</script> 
+0

JavaScript로 만족스럽지 않습니까? 그 기능을 만드는 방법을 설명해 주시겠습니까? – Exwolf

+0

JS 함수 예제와 HTML 코드 스 니펫을 추가했습니다. jQuery와 같은 JS 라이브러리를 사용하지 않는 이유는 무엇입니까? (Ajax 요청을 만들고 DOM 요소를 수정하는 것이 더 쉬울 것입니다.) – hrvoj3e

+0

php로 처리하고 while 루프에 넣고 각 responseMsg에 ID를 첨부합니다. – Exwolf