|
|
|
สอบถามเรื่อง FullCalendar อยากเปลี่ยนสี BackGround ของปฏิทิน โดยสามารถสลับสีกันได้(Events Color) หน่อยครับ |
|
|
|
|
|
|
|
ทำได้แร้วจ๊า ^ ^
|
|
|
|
|
Date :
2012-02-07 14:38:10 |
By :
nut_ch31 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ทำยังไงอ่ะค่ะรบกวนสอนหน่อยได้ไหมค่ะ
หาวิธีเปลี่ยนไม่ได้ซักที
|
|
|
|
|
Date :
2013-03-08 11:00:42 |
By :
May |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ลองสมัครสมัครสมาชิกแล้ว PM ไปดูครับ
|
|
|
|
|
Date :
2013-03-08 11:18:44 |
By :
mr.win |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
เอาเมล์คุณมาครับ เด่วผมตอบกลับให้
|
|
|
|
|
Date :
2013-03-11 10:32:41 |
By :
nut_ch31 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ผมจำ ตย code ไม่ได้แ้ล้วน่ะครับ แต่จำ concept ได้เหมือนตอน query task งานจากฐานข้อมูลอ่ะครับให้เปรียบเทียบกับ วันที่ปัจจุบัน แล้วเราก็ทำเงื่อนไขต่างๆว่าให้ เข้า if else ตามเงื่อนไข โดยเปลี่ยนตัวแปรทีเ่ป็น eventColor เอาอ่ะครับ
พอดี Source Code อยู่ที่ทำงานเก่าอ่ะครับ Y Y
|
ประวัติการแก้ไข 2013-03-11 10:57:07
|
|
|
|
Date :
2013-03-11 10:56:20 |
By :
nut_ch31 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
event.php
Code (PHP)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel='stylesheet' type='text/css' href='cupertino/theme.css' />
<link rel='stylesheet' type='text/css' href='fullcalendar/fullcalendar.css' />
<link rel='stylesheet' type='text/css' href='fullcalendar/fullcalendar.print.css' media='print' />
<script type='text/javascript' src='js/jquery-1.7.1.min.js'></script>
<script type='text/javascript' src='js/jquery-ui-1.8.17.custom.min.js'></script>
<script type='text/javascript' src='fullcalendar/fullcalendar.js'></script>
<link rel="stylesheet" href="colorbox.css" />
<script src="colorbox/jquery.colorbox.js"></script>
<script type='text/javascript'>
$(document).ready(function() {
//var view=colorbox({iframe:true, width:"80%", height:"100%"});
$('#calendar').fullCalendar({
theme: true,
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
selectable: true,
selectHelper: false,
editable: false,
events: "json-events.php",
eventDrop: function(event, delta) {
alert(event.title + ' was moved ' + delta + ' days\n' +
'(should probably update your database)');
},
eventClick: function(event) {
$.fn.colorbox({href:event.url, iframe:true, width:"80%", height:"100%"});
return false;
},
loading: function(bool) {
if (bool) $('#loading').show();
else $('#loading').hide();
}
});
});
</script>
<style type='text/css'>
#loading {
position: absolute;
top: 5px;
right: 5px;
}
#calendar {
width: 70%;
margin: 0 auto;
}
</style>
</head>
<body>
<div id='loading' style='display:none'>loading...</div>
<div id='calendar'></div>
</br>
<br />
<table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<th>หมายเหตุ : </th>
<td bgcolor="#003399" width="20"> </td>
<td><span style="margin:0 auto; padding:3px;">จัดอบรมแล้ว</span></td>
<td bgcolor="#006600" width="20"> </td>
<td><span style="margin:0 auto; padding:3px;">อบรมอยู่ในช่วงนี้</span></td>
<td bgcolor="#FF3300" width="20"> </td>
<td><span style="margin:0 auto; padding:3px;">ยังไม่เปิดให้จอง</span></td>
</tr>
</table>
<p style='margin:0 auto; padding:3px;' align='center'><br />
</p></br>
<center><input name="botton" type="button" value="กลับหน้าหลัก" style="background:#39C; height:30px; width:80px; border:1px solid #069; color:#FFF;" onclick="window.location.href='./?page=home'"> </center>
</br>
</body>
</html>
json-event.php
Code (PHP)
<?php
include "config.php";
$sql = "SELECT * FROM project";
$json = array();
$result = mysql_query ($sql);
while($row = mysql_fetch_assoc ($result))
{
if($row['pro_status']=='1' AND $row['pro_end'] > date('Y-m-d')){
$color = '#009900';
}else if ($row['pro_status']=='1' AND $row['pro_end'] < date('Y-m-d')){
$color = '#0066CC';
}else{
$color = '#FF9900';
}
$project = array(
'id' => $row['pro_id'],
'title' => $row['pro_name'],
'start' => $row['pro_st'],
'end' => $row['pro_end'],
'url' => "detail.php?id=$row[pro_id]",
"color"=> $color
);
array_push($json, $project);
}
echo json_encode($json);
?>
|
|
|
|
|
Date :
2013-03-11 11:48:47 |
By :
Manussawin |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ยัง งง เลย
|
|
|
|
|
Date :
2013-03-20 13:05:44 |
By :
bankNay |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Nutja ส่งให้ผมทางเมลหน่อยได้ไหมครับ [email protected]
|
|
|
|
|
Date :
2013-05-29 10:10:41 |
By :
phuwanart |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
อันดับแรก ไปโหลด fullcalendar-2.3.1 มาก่อนน่ะครับ
http://fullcalendar.io/
ไฟล์สำหรับแสดง calendar
Code (PHP)
<?php include("header.php");
include("lib/lib.php");
if($_REQUEST["default_date"]){
$default_date = $_REQUEST["default_date"];
}else{
$default_date = date("Y-m-d");
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<link href='fullcalendar-2.3.1/fullcalendar.css' rel='stylesheet' />
<link href='fullcalendar-2.3.1/fullcalendar.print.css' rel='stylesheet' media='print' />
<script src='fullcalendar-2.3.1/lib/moment.min.js'></script>
<script src='fullcalendar-2.3.1/lib/jquery.min.js'></script>
<script src='fullcalendar-2.3.1/fullcalendar.min.js'></script>
<script type="text/javascript">
$(document).ready(function() {
var calendar = $('#calendar').fullCalendar({
disableDragging: true,
header: {
left: ' today,prevYear,nextYear',
center: 'title',
right: 'prev,next,month'
},
defaultDate: '<?php echo $default_date;?>',
eventSources: ['getEvents.php?id=<?php echo $_REQUEST["hotel_id"];?>','home.php'],
eventClick: function(event) {
// opens events in a popup window
window.open(event.url, 'gcalevent', 'width=500,height=1050,toolbar=0,menubar=0,location=0,status=0,scrollbars=0,resizable=0,left=280,top=180');
return false;
},
loading: function(bool) {
$('#loading').toggle(bool);
}
});
});
</script>
<style>
body {
margin: 40px 10px;
padding: 0;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
font-size: 14px;
}
#calendar {
max-width: 1150px;
margin: 0 auto;
}
#loading {
display: none;
position: absolute;
top: 10px;
right: 10px;
}
</style>
</head>
<body>
<table border=1 width="100%">
<tr>
<td>Hotel</td>
<td><?php echo search_hotel($_REQUEST["hotel_id"],"name");?></td>
</tr>
<tr>
<td>Service</td>
<td><?php echo search_hotel($_REQUEST["hotel_id"],"service_code");?></td>
</tr>
<tr>
<td>City</td>
<td><?php echo search_hotel($_REQUEST["hotel_id"],"city_code");?></td>
</tr>
<tr>
<td>Market</td>
<td><?php echo search_market(search_hotel($_REQUEST["hotel_id"],"market_detail"));?></td>
</tr>
</table>
<BR><BR>
<div id='calendar'></div>
</body>
</html>
ไฟล์สำหรับ query ข้อมูลครับ
Code (PHP)
<?php include("connection/config.php");
include("lib/lib.php");
$sql="select * from allotment_item where hotel_id='".$_REQUEST["id"]."' and status='1' order by no_id ";
$query=mysql_query($sql);
while($result=mysql_fetch_array($query)){
$balance=$result["allotment_available"];
$region=$result["region"];
$agent_name=agent_name($result["main_id"]);
$txt=search_code_room($result["room_id"])." ".$region." ".$agent_name." ".$balance;
if($result["stop_sales_status"]==0){
$bgcolor="#ccff66";
}else{
$bgcolor="#ff6600";
}
if($balance!=0){
$color='black';
}else{
$color='red';
}
$event_array[] = array(
'id' => $result["no_id"],
'title' => $txt,
'start' => $result["date"],
'end' => $result["date"],
'url' => "allotment_fullcalendar_edit.php?no_id=$result[no_id]",
'backgroundColor' => $bgcolor,
'textColor' => $color
);
}
echo json_encode($event_array);
?>
|
|
|
|
|
Date :
2016-03-30 11:01:15 |
By :
nut_ch31 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="js/fullcalendar-2.1.1/fullcalendar.min.css">
<style type="text/css">
html,body{
maring:0;padding:0;
font-family:tahoma, "Microsoft Sans Serif", sans-serif, Verdana;
font-size:12px;
}
#calendar{
background-color: #A3DCA6; //เพิมแถวนี้เข้าไปเป็นสี BG
max-width: 700px;
margin: 0 auto;
font-size:13px;
}
</style>
</head>
<body>
<br><br>
<div style="margin:auto;width:800px;"> <!-- ขยับ -->
<div id='calendar'></div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="js/fullcalendar-2.1.1/lib/moment.min.js"></script>
<script type="text/javascript" src="js/fullcalendar-2.1.1/fullcalendar.min.js"></script>
<script type="text/javascript" src="js/fullcalendar-2.1.1/lang/th.js"></script>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
|
|
|
|
|
Date :
2017-10-19 09:12:41 |
By :
11 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Load balance : Server 02
|