みんなに優しく、解りやすくをモットーに開設しています。 以下のルールを守りみんなで助け合いましょう。
1.ファイルメーカーで解らない事があればここで質問して下さい。 何方でも、ご質問・ご回答お願いします。 （優しく回答しましょう）
You are not logged in.
【質問内容】
初めまして、41kenと申します。
webビューアでFullcalendarが表示できません。
表示できるようご指導ください。
【これまでの経過】
webビューアにFullcalendarを表示させたいとおもいまして、
Fullcalendarのサイトで提供されているサンプルのhtmlをデータURLスキームで書いてみたのですが、
webビューアにはなにも表示されません。
記述方法として、
CSS,javaScriptをリンクで読み込む方法とファイルメーカー内に直接保存して
置き換える方法で書いてみましたが両方とも表示できませんでした。
私の記述方法のどこに間違いがあるのかご指摘いただければ幸いです。
どうぞよろしくお願いいたします
【環境】
・Mac版のFMPアドバンス版13.0v5
MacOS10.10.4
【ためしたこと】
記述１（css,javascriptを全てFullcalendarのサイトのリンクにしてみました）
結果 なにも表示されず
具体的な記述内容
"data:text/html;charset=utf-8," &
"<!DOCTYPE html>
<head>
<link href='http://fullcalendar.io/js/fullcalendar-2.3.2/fullcalendar.css' rel='stylesheet' />
<link href='http://fullcalendar.io/js/fullcalendar-2.3.2/fullcalendar.print.css' rel='stylesheet' media='print' />
<script src='http://fullcalendar.io/js/fullcalendar-2.3.2/lib/moment.min.js'></script>
<script src='http://fullcalendar.io/js/fullcalendar-2.3.2/lib/jquery.min.js'></script>
<script src='http://fullcalendar.io/js/fullcalendar-2.3.2/fullcalendar.min.js'></script>
<script>
$(document).ready(function() {
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay'
},
defaultDate: '2015-02-12',
editable: true,
eventLimit: true, // allow 'more' link when too many events
events: [
{
title: 'All Day Event',
start: '2015-02-01'
},
{
title: 'Long Event',
start: '2015-02-07',
end: '2015-02-10'
},
{
id: 999,
title: 'Repeating Event',
start: '2015-02-09T16:00:00'
},
{
id: 999,
title: 'Repeating Event',
start: '2015-02-16T16:00:00'
},
{
title: 'Conference',
start: '2015-02-11',
end: '2015-02-13'
},
{
title: 'Meeting',
start: '2015-02-12T10:30:00',
end: '2015-02-12T12:30:00'
},
{
title: 'Lunch',
start: '2015-02-12T12:00:00'
},
{
title: 'Meeting',
start: '2015-02-12T14:30:00'
},
{
title: 'Happy Hour',
start: '2015-02-12T17:30:00'
},
{
title: 'Dinner',
start: '2015-02-12T20:00:00'
},
{
title: 'Birthday Party',
start: '2015-02-13T07:00:00'
},
{
title: 'Click for Google',
url: 'http://google.com/',
start: '2015-02-28'
}
]
});
});
</script>
<style>
body {
margin: 40px 10px;
padding: 0;
font-family: 'Lucida Grande',Helvetica,Arial,Verdana,sans-serif;
font-size: 14px;
}
#calendar {
max-width: 900px;
margin: 0 auto;
}
</style>
</head>
<body>
<div id='calendar'></div>
</body>
</html>"
記述２ css,javascriptを全てファイルメーカー内にテキストとして配置、それぞれの名前をつけておいて
GetLayoutObjectAttribute ( "それぞれの名前" ; "content" )で、全てを読み込んでみました。
結果 やはりなにも表示されませんでした
具体的な記述内容
"data:text/html;charset=utf-8," &
"
<!DOCTYPE html>
<head>
<style type='text/css'>" &
GetLayoutObjectAttribute ( "fullcalendar.css" ; "content" ) &
"</style>
<style type='text/css' media='print ' >" &
GetLayoutObjectAttribute ( "fullcalendar.print.css" ; "content" ) &
"</style>
<script type='text/javascript' >" &
GetLayoutObjectAttribute ( "moment.min.js" ; "content" ) &
"</script>
<script type='text/javascript' >" &
GetLayoutObjectAttribute ( "jquery.min.js" ; "content" ) &
"</script>
<script type='text/javascript' >" &
GetLayoutObjectAttribute ( "fullcalendar.min.js" ; "content" ) &
"</script>
<script>
$(document).ready(function() {
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
defaultDate: '2015-02-12',
selectable: true,
selectHelper: true,
select: function(start, end) {
var title = prompt('Event Title:');
var eventData;
if (title) {
eventData = {
title: title,
start: start,
end: end
};
$('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true
}
$('#calendar').fullCalendar('unselect');
},
editable: true,
eventLimit: true, // allow 'more' link when too many events
events: [
{
title: 'All Day Event',
start: '2015-02-01'
},
{
title: 'Long Event',
start: '2015-02-07',
end: '2015-02-10'
},
{
id: 999,
title: 'Repeating Event',
start: '2015-02-09T16:00:00'
},
{
id: 999,
title: 'Repeating Event',
start: '2015-02-16T16:00:00'
},
{
title: 'Conference',
start: '2015-02-11',
end: '2015-02-13'
},
{
title: 'Meeting',
start: '2015-02-12T10:30:00',
end: '2015-02-12T12:30:00'
},
{
title: 'Lunch',
start: '2015-02-12T12:00:00'
},
{
title: 'Meeting',
start: '2015-02-12T14:30:00'
},
{
title: 'Happy Hour',
start: '2015-02-12T17:30:00'
},
{
title: 'Dinner',
start: '2015-02-12T20:00:00'
},
{
title: 'Birthday Party',
start: '2015-02-13T07:00:00'
},
{
title: 'Click for Google',
url: 'http://google.com/',
start: '2015-02-28'
}
]
});
});
</script>
<style>
body {
margin: 40px 10px;
padding: 0;
font-family: 'Lucida Grande',Helvetica,Arial,Verdana,sans-serif;
font-size: 14px;
}
#calendar {
max-width: 900px;
margin: 0 auto;
}
</style>
</head>
<body>
<div id='calendar'></div>
</body>
</html>
"
以上よろしくお願いいたします。
// allow 'more' link when too many events
改行がないのでこの部分以降が全てコメントとみなされているのが原因でしょう。
文字列中の改行はスペースに置き換えられます。
barikan様、ご指摘ありがとうございました。
おかげさまで、アドバイスどおりに直しましたところ、無事表示できるようになりました。
本当にありがとうございました。
同時に、つくづく勉強不足を実感いたしました。
よりいっそう精進いたします。
[ Generated in 0.005 seconds, 7 queries executed - Memory usage: 533.03 KiB (Peak: 572.59 KiB) ]