2016-07-04 5 views
1

아래 코드는 양식 또는 페이지에로드되는 다른 HTML을 복제 (복제)하는 것 같습니다.두 번 페이지로드 객체

처음 내가 모든 문자 (I 페이지에 배치하거나 다른 HTML)를 두 번 형태로 표시

을 검색 텍스트 상자에 입력 및 삭제 그러나 때 양식이 정상적으로 표시되는 페이지를로드 양식이나 다른 페이지 내용을 반복하지 않고 페이지를로드하는 방법은 무엇입니까?

enter image description here

<?php 
    include('..\db.php'); 
    $con = mysqli_connect($dbsrvname, $dbusername, $dbpassword, $dbname); 
    $q1 = mysqli_query($con, "SELECT * FROM tbl1 username"); 
    $data = ""; 

    // if the search is true 
    if(isset($_POST['search'])) 
    { 
     // 
     $var = $_POST['search']; 

     if ($query = mysqli_query($con,"SELECT username FROMtbl1 WHERE username LIKE '%$var%'")) 
     { 
      // possible creating duplicate results 
      while($row = mysqli_fetch_array($query)) 
      { 
       $data .= '<div>' . $row['username'] . '</div>'; 
      } 
      echo $data; 
     } 
    } 
    else 
    { 
    } 
?> 
<HTML> 
<head> 
    <script src="https://code.jquery.com/jquery-3.0.0.js" integrity="sha256-jrPLZ+8vDxt2FnE1zvZXCkCcebI/C8Dt5xyaQBjxQIo=" crossorigin="anonymous"></script> 
    <script> 
     $(function() { 
      $('.input').keyup(function() { 
       var a = $('.input').val(); 
       $.post('livesusers.php', { "search": a }, function(data) { 
        $('#display').html(data); 
       }); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    // form to input text and search 
    <h1>Search For User</h1> 
    <form action= "livesusers.php" method='POST'> 
     <input type="text" name="search" class='input'> 
    </form> 
    <div id='display' style='margin-top: 100px'></div> 
</body> 

답변

1

문제가보십시오. 요청의 응답에는 PHP 코드와 그 아래 HTML이 포함되어 있으므로 현재 페이지가 전체적으로 복제됩니다. 이 문제를 해결하려면 PHP 코드를 자체 파일에 저장하고 해당 위치로 AJAX 요청을 만드십시오.

<!DOCTYPE HTML> 
<html> 
<head> 
    <script src="https://code.jquery.com/jquery-3.0.0.js" integrity="sha256-jrPLZ+8vDxt2FnE1zvZXCkCcebI/C8Dt5xyaQBjxQIo=" crossorigin="anonymous"></script> 
    <script> 
     $(function() { 
      $('.input').keyup(function() { 
       var a = $('.input').val(); 
       // change the page name below as required... 
       $.post('response.php', { "search": a }, function(data) { 
        $('#display').html(data); 
       }); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <h1>Search For User</h1> 
    <form action= "livesusers.php" method='POST'> 
     <input type="text" name="search" class='input'> 
    </form> 
    <div id='display' style='margin-top: 100px'></div> 
</body> 
</html> 

이 훨씬 더 강력한 당신이 JSON을 반환하는 PHP 코드 교환을 고려해야하려면

response.php (이름은 원하는대로이)

<?php 
    include('..\db.php'); 
    $con = mysqli_connect($dbsrvname, $dbusername, $dbpassword, $dbname); 
    $q1 = mysqli_query($con, "SELECT * FROM tbl1 username"); 
    $data = ""; 

    // if the search is true 
    if(isset($_POST['search'])) 
    { 
     // 
     $var = $_POST['search']; 

     if ($query = mysqli_query($con,"SELECT username FROMtbl1 WHERE username LIKE '%$var%'")) 
     { 
      // possible creating duplicate results 
      while($row = mysqli_fetch_array($query)) 
      { 
       $data .= '<div>' . $row['username'] . '</div>'; 
      } 
      echo $data; 
     } 
    } 
    else 
    { 
    } 
?> 

display.php이 시도 인코딩되지 않은 문자열 대신. 이를 수행하는 방법에 대한 설명은 this question을 참조하십시오.

+0

감사합니다. 우수한 조언과 작품 –

0

다음 코드는 문제를 가지고이 두 번 자체에 데이터를 추가입니다!

$data .= $data . '<div>' . $row['username'] . '</div>'; 

은 현재 페이지에 AJAX 요청 을하고 있기 때문에이 대신

$data .= '<div>' . $row['username'] . '</div>'; 
+0

죄송합니다. 이전 오류에서 이미 변경되었습니다. 위의 코드로 업데이트했습니다. 나는 이전 사본을 붙여 넣었다. 문제는 여전히 남아 있습니다. –