2010-05-05 5 views
1

나는 search.html에 ajax를 통해 search.php 페이지를 호출합니다. 문제는 페이징을 구현했기 때문에 사용자가 '다음'버튼을 클릭하면 search.html의 검색 키워드가있는 텍스트 상자가 사라진다 [텍스트 상자 요소가없는 search.php로 이동하기 때문에]페이징에서 텍스트 상자가 사라집니다 - ph

사용자가 페이징을 통해 레코드를 검색 할 때 search 키워드가있는 텍스트 상자가 있어야합니다. 내가 어떻게 이걸 얻었 니?

search.html에 :

<body> 
    <form name="myform" class="wrapper"> 
     <input type="text" name="q" onkeyup="showPage();" class="txt_search"/> 
     <input type="button" name="button" onclick="showPage();" class="button"/> 
     <p> 
     <div id="txtHint"></div> 
     <div id="page"></div> 

    </form> 
    </body> 

search.php [관련 부분] :

$self = $_SERVER['PHP_SELF']; 
      $limit = 5; //Number of results per page 
      $numpages=ceil($totalrows/$limit); 

      $query = $query." ORDER BY idQuotes LIMIT " . ($page-1)*$limit . ",$limit"; 
      $result = mysql_query($query, $conn) 
      or die('Error:' .mysql_error()); 
?> 

<div class="caption">Search Results</div> 
<div class="center_div"> 
<table> 
    <?php while ($row= mysql_fetch_array($result, MYSQL_ASSOC)) { 
     $cQuote = highlightWords(htmlspecialchars($row['cQuotes']), $search_result); 
     ?> 
     <tr> 
     <td style="text-align:right; font-size:15px;"><?php h($row['cArabic']); ?></td> 
      <td style="font-size:16px;"><?php echo $cQuote; ?></td> 
      <td style="font-size:12px;"><?php h($row['vAuthor']); ?></td> 
      <td style="font-size:12px; font-style:italic; text-align:right;"><?php h($row['vReference']); ?></td> 
     </tr> 
    <?php } ?> 
</table> 
</div> 

<?php 
    //Create and print the Navigation bar 
     $nav=""; 
     if($page > 1) { 
      $nav .= "<a href=\"$self?page=" . ($page-1) . "&q=" .urlencode($search_result) . "\">< Prev</a>"; 

      $first = "<a href=\"$self?page=1&q=" .urlencode($search_result) . "\"><< First</a>" ; 
     } 

     else { 
      $nav .= "&nbsp;"; 
      $first = "&nbsp;"; 
     } 

     for($i = 1 ; $i <= $numpages ; $i++) { 
      if($i == $page) { 
       $nav .= "<B>$i</B>"; 
      }else{ 
       $nav .= "<a href=\"$self?page=" . $i . "&q=" .urlencode($search_result) . "\">$i</a>"; 
      } 
     } 

     if($page < $numpages) { 
      $nav .= "<a href=\"$self?page=" . ($page+1) . "&q=" .urlencode($search_result) . "\">Next ></a>"; 

      $last = "<a href=\"$self?page=$numpages&q=" .urlencode($search_result) . "\">Last >></a> "; 
     } 

     else { 

      $nav .= "&nbsp;"; 
      $last = "&nbsp;"; 
     } 

     echo "<br /><br />" . $first . $nav . $last; 


    } 

은 ajax.js :

var xmlHttp 

function showPage(str) 
{ 
    var str = document.myform.q.value; 

xmlHttp=GetXmlHttpObject(); 
if (xmlHttp==null) 
{ 
alert ("Browser does not support HTTP Request"); 
return; 
} 

var url="search.php"; 
url += "?q="+str+"&list="; 
url += "&sid="+Math.random(); 
xmlHttp.onreadystatechange=stateChanged; 
xmlHttp.open("GET",url,true); 
xmlHttp.send(null); 
} 


function stateChanged(){ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ 
document.getElementById("txtHint").innerHTML=xmlHttp.responseText; 
} //end if 
} //end function 

function GetXmlHttpObject() { 
var xmlHttp=null; 
try { 
// For these browsers: Firefox, Opera 8.0+, Safari 
xmlHttp=new XMLHttpRequest(); 
}catch (e){ 
//For Internet Explorer 
try{ 
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); 
} catch (e) { 
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
} 
return xmlHttp; 
} //end function */ 

답변

1

당신의 다음 및 이전 링크를 사용할 필요가 AJAX도.

코드 샘플을 제공 하겠지만 AJAX를 통해 search.php를 가져 오는 데 사용하는 코드를 제공하지 않았습니다. AJAX 코드를 게시하면 AJAX를 통해 다음 및 이전 페이지를 가져 오기 위해 필요한 변경 사항을 보여줄 수 있습니다.

편집 : 나는 페이지 번호를 허용하도록 showPage 기능을 수정하고 다음 및 이전 링크가 있다는 전화를 할 것 :

$nav .= "<a onclick=\"showPage('',$i); return false;\" href=\"$self?page=$i&q=" .urlencode($search_result) . "\">$i</a>"; 
:

function showPage(str,page) 
{ 
    var str = document.myform.q.value; 
    if(typeof page == 'undefined') 
     page = 0; 

xmlHttp=GetXmlHttpObject(); 
if (xmlHttp==null) 
{ 
alert ("Browser does not support HTTP Request"); 
return; 
} 

var url="search.php"; 
url += "?q="+str+"&page="+page+"&list="; 
url += "&sid="+Math.random(); 
... 

그런 다음, 페이지 링크가 같아야합니다

+0

이 코드로 질문을 업데이트했습니다. 확인해주십시오. – input

+0

차가움. 코드로 업데이트 된 답변 :-) – Josh

+0

감사합니다. 나는 코드를 수정했지만, 이제는 SQL 오류가 발생합니다. '오류 : SQL 구문에 오류가 있습니다. 귀하의 MySQL 서버 버전에 해당하는 설명서를 확인하여 올바른 구문을 찾으십시오. '-5,5'를 line 1 근처에서 사용하십시오. 제가 아약스의 수정 사항과 관련이 있다고 가정하고 있습니까? – input

관련 문제