CODEWITHSUNDEEP
javascriptcalendardojo
curt
curt

Reputation: 4592

Dojo Calendar Sample Code Doesn't Work

I'm trying to test dojo Calendar. I was having problems so I made a test page and copied the example code from the dojo site. It manifested the same problem: the text is displayed with very large vertical gaps in it and little other formatting. I can't get the test on their page to work either so I don't know what it's supposed to look like. 

<!DOCTYPE html>
<html>
<head>

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dijit/themes/claro/claro.css" />

<script>dojoConfig = {parseOnLoad: true}</script>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js"></script>

<script>
    require(["dojo/parser", "dojo/ready", "dojox/calendar/Calendar"],
        function(parser, ready, Calendar){
            ready(function(){
                    calendar = new Calendar({
                        dateInterval: "day",
                        style: "position:relative;width:600px;height:600px"
                    }, "someId");
                }
            )}
    );
</script>
</head>
<body class="claro">
<style type="text/css">
.dojoxCalendar{ font-size: 12px; font-family:Myriad,Helvetica,Tahoma,Arial,clean,sans-serif; }
</style>

<div id="someId" >
</div>
</body>
</html>

The only change I made was to use the libraries at ajax.googleapis.com. Should I also include dojox? I thought it came with dojo.js.

Upvotes: 1

Views: 1767

Answers (1)

Sean Zhao
Sean Zhao

Reputation: 1516

You missed including style file, add this into the head and it will be OK:

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojox/calendar/themes/claro/Calendar.css" />

or see this jsfiddle

Upvotes: 2

Related Questions