Ajax PHP 에서 비동기로 게시글 불러오기

안녕하세요 Dipokal HHJ 입니다.

이번시간에는 index.php 에서 comm_list.php 를 Ajax 로 불러와서 index.php 에 출력을 해볼겁니다.

 

현재 개발중인 웹페이지 입니다.

DeVent 커뮤니티

 

먼저 index.php 의 자바스크립트를 작성할 겁니다.

이 코드는 </body> 바로 위에 작성합니다.

 

 

* 아래 코드를 사용하기 위해서는 index.php 에

<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>

를 삽입하시고 사용해 주세요

<script type="text/javascript">
$(document).ready(function(){
 
  loading();
 
  function loading(){
    $.ajax({
    url: 'comm_list.php' ,
    dataType : 'html' ,
    success: function(data) {
      $("#result").html(data);
    }
  });
  }
});
</script>

 

다음으로 comm_list.php 가 표시되는 지점에

<div id="result"/>

 이 코드를 삽입해 주세요

 

다음은 comm_list.php 입니다.

comm_list.php 는 php 와 mysql 을 이용합니다. 

작성 요령은 

 

<?php
//php 5.6 기반으로 작성됨.
//아래의 모든 소스코드는 실제 DeVent 웹페이지와 전혀 다릅니다. 이해를 돕기위해 작성한 코드 입니다.
 
//Mysql 쿼리 실행
$q = "SELECT * FROM commlist order by idx desc limit 50";
$result = mysql_query($q);
if($result === FALSE) {
    die(mysql_error()); 
}
 
//게시글 
while($row = mysql_fetch_array($result)){
?>
 
<div class='alert alert-light' role='alert'>
<b><?=$row['name']?></b>
 
</div>
<?php
 
}
?>

이렇게 작성하시고 index.php 를 열게되면

comm_list.php 화면이 리디렉션 없이 보여지게 됩니다.

 

감사합니다.