I try to make calendar's property: showWeek customizable, for example hide or show week numbers and week header
and it's not working.
Can you point me my mistakes, please?
Here is the code bellow:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>First Day of Week - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
<script type="text/javascript">
$(function()
{
$('#cc').calendar({showWeek:false});
changeShowWeek('false');
});
function changeShowWeek(atype)
{
$('#cc').calendar({
showWeek:(atype=='false'?'false':'true'),
weekNumberHeader:(atype=='false'?'':'WK')
});
}
</script>
</head>
<body>
<h2>First Day of Week</h2>
<p>Choose the first day of the week.</p>
<div style="margin:20px 0">
<select onchange="$('#cc').calendar({firstDay:this.value})">
<option value="0">Sunday</option>
<option value="1">Monday</option>
<option value="2">Tuesday</option>
<option value="3">Wednesday</option>
<option value="4">Thursday</option>
<option value="5">Friday</option>
<option value="6">Saturday</option>
</select>
</div>
<div style="margin:20px 0">
<select onchange="$('#cc').calendar({year:this.value})">
<option value="2018">2018</option>
<option value="2019">2019</option>
</select>
</div>
<div style="margin:20px 0">
<select onchange="$('#cc').calendar({month:this.value})">
<option value="1">jan</option>
<option value="2">feb</option>
<option value="3">mar</option>
</select>
</div>
<div style="margin:20px 0">
<span>Show week:</span>
<select onchange="changeShowWeek(this.value)">
<option selected>false</option>
<option>true</option>
</select>
</div>
<div id="cc" class="easyui-calendar" showWeek="false" style="width:250px;height:250px;"></div>
</body>
</html>
Thank you!
Show Posts
