반응형
[초간단] php ajax mysql 페이스북 담벼락 알림기능 구현
#화면
#index.php
<!DOCTYPE html>
<html>
<head>
<title>알림</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<br>
<br>
<div class="container">
<br>
<h2 align = "center">알림 구현</h2>
<br>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">WebSiteName</a>
</div>
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<span class="label label-pill label-danger count"></span>
알림</a>
<!-- 알림 붙는 곳 -->
<ul class="dropdown-menu"></ul>
</li>
</ul>
</div>
</nav>
<br/>
<form method="post" id="comment_form">
<div class="form-group">
<label>제목</label>
<input type="text" name ="subject" id="subject" class="form-control" />
</div>
<div class="form-group">
<label>본문</label>
<textarea name ="comment" id="comment" class="form-control" rows="5"></textarea>
</div>
<div class="form-group">
<input type="submit" name ="post" id="post" class="btn btn-info" value="post"/>
</div>
</form>
</div>
</body>
</html>
<script>
$(document).ready(function(){
//알림 글 가져오기
function load_unseen_notification(view='')
{
$.ajax({
url:"fetch.php",
method:"POST",
data:{view:view},
dataType:"json",
success:function(data){
$('.dropdown-menu').html(data.notification);
if(data.unseen_notification > 0)
{
$('.count').html(data.unseen_notification);
}
}
})
}
load_unseen_notification();
//글 입력
$('#comment_form').on('submit', function(event){
event.preventDefault();
alert('z');
if($('#subject').val() != '' && $('#comment').val() != '')
{
var form_data = $(this).serialize();
$.ajax({
url:"insert.php",
method:"POST",
data:form_data,
success:function(data){
$('#comment_form')[0].reset();
load_unseen_notification();
},
error:function(request,status,error){
alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
}
});
}else{
alert("빈칸을 채워주세요");
}
});
// 알림클릭했을 때 알림 숫자 지워주기
$(document).on('click', '.dropdown-toggle', function(){
$('.count').html('');
load_unseen_notification('yes');
});
setInterval(function(){
load_unseen_notification();;
}, 5000);
});
</script>
#fetch.php
<?php
if(isset($_POST["view"]))
{
include("connect.php");
//알림창을 눌렀을 때 0 을 1로 변경 0:안봄 , 1: 봄
if($_POST["view"]!='')
{
$update_query = "update comments set comment_status =1 where comment_status=0";
mysqli_query($connect , $update_query);
}
// 최근글 5개만 가져오기
$query = "select * from comments order by comment_id desc limit 5";
$result = mysqli_query($connect, $query);
$output ='';
if(mysqli_num_rows($result) > 0)
{
while($row = mysqli_fetch_array($result))
{
$output .= '
<li>
<a herf="#">
<strong>'.$row["comment_subject"].'</strong><br>
<small><em>'.$row["comment_text"].'</em></small>
</a>
</li>
';
}
}else
{
$output .= '
<li><a herf="#" class="text-bold text-italic">알림이 없습니다.</a></li>
';
}
//안본글 만 가져와서 숫자 표시해주기
$query_1 = "select * from comments where comment_status = 0";
$result_1 = mysqli_query($connect, $query_1);
$count = mysqli_num_rows($result_1);
$data = array(
'notification' => $output,
'unseen_notification' => $count
);
echo json_encode($data);
}
?>
#insert.php
<?php
include("connect.php");
//insert.php
if(isset($_POST["subject"]))
{
$subject = mysqli_real_escape_string($connect, $_POST["subject"]);
$comment = mysqli_real_escape_string($connect, $_POST["comment"]);
$query = "INSERT INTO comments(comment_subject, comment_text, comment_status) VALUES ('$subject', '$comment' ,0)";
mysqli_query($connect, $query);
}
?>
#connect.php
<?php
//connect.php;
$connect = mysqli_connect("localhost", "root", "비번","db이름");
?>
#테이블 쿼리
CREATE TABLE IF NOT EXISTS `comments` (
`comment_id` int(11) NOT NULL,
`comment_subject` varchar(250) NOT NULL,
`comment_text` text NOT NULL,
`comment_status` int(1) NOT NULL
);
반응형
'PHP 박살내기 > php ajax json' 카테고리의 다른 글
| php ajax mysql 특정유저 차단하기 기능 구현 (0) | 2017.10.02 |
|---|---|
| php mysql로 facebook 좋아요 구현 단순 핵심소스만! (0) | 2017.09.28 |
| php 좋아요 기능& 알림기능 구현 4 (알림 부분) (6) | 2017.09.27 |
| php ajax로 달력만들기 예제 1 (0) | 2017.09.25 |
| php session을 이용한 간단한 쇼핑 장바구니 구현 (1) | 2017.09.22 |
댓글