Hello
I have an existing Spring MVC with Hibernate app and I would like to
integrate the JSP Scheduler into the app. I am currently having an issue
where none of my data is showing in the scheduler (please see the
attached screen shot).
Below are my steps. I just think I am missing something. Specifically, I
do not know if there is a specific client side javascript data model
that I have to map my data to with required model property names to make
sure the control renders. If I do have to follow a model, do you a link
to the documentation that describes what the required fields are etc
for the scheduler?
I have followed the samples included with the eval by installing the
scheduler controller, the jsp tag library jar and the index jsp page. I
modified the controller and jsp page to point to my existing models
instead of the sample models.
When I launch the page, the scheduler load but the loading spinner icon
just spins. So I checked the javascript console and i get the following:
Uncaught TypeError: undefined is not a function. kendo.all.min.js:9
I then checked the network tab of the developer tools to make sure the
page is loading my json data model from the server. It appears to load
as expected and looks like the following json:
[{"case_id":6,"status":"4","hospital_id":"4","doctor_id":"1","procedure_id":"1","user_id":"9","implant_id":null,"start_date":1393857600000,"end_date":1393857900000,"contact_lastname":"asl;kdjf","contact_midname":null,"contact_firstname":"asldkj","prefix":null,"suffix":null,"gender":"M","birth_date":"asdlk;fj","color":"rgb(235,147,115)","area_id":"3","products_selected":"68|1|0~69|1|0~","notes":"","po_number":"","tracking_number":"","wh_group_name":"LIMA","hospital_name":"St.Vincent Medical Center","procedure_name":"Shoulder
Replacement","doctor_name":null,"restock_track_no":null,"case_names":"New event"},blah blah]
Here is my code in the controller
@RequestMapping(value = {"/", "/index"}, method = RequestMethod.GET)
public String index(Locale locale, Model model) {
return "scheduler/index";
}
@RequestMapping(value = "/index/read", method = RequestMethod.GET)
public @ResponseBody List<CaseEntity> read() {
return caseEntity.getList();
}
The following is my jsp tags mapping the json to the kendo model.
<kendo:dataSource-schema>
<kendo:dataSource-schema-model id="caseId">
<kendo:dataSource-schema-model-fields>
<kendo:dataSource-schema-model-field name="case_id" type="number"/>
<kendo:dataSource-schema-model-field name="hospital_name" defaultValue="No title"
type="string"/>
<kendo:dataSource-schema-model-field name="user_id" type="number" defaultValue="1"/>
<kendo:dataSource-schema-model-field name="start_date" type="date"/>
<kendo:dataSource-schema-model-field name="end_date" type="date"/>
<%-- commented out as I am just try to display data at this moment-%>
<%--kendo:dataSource-schema-model-field name="description" type="string" />
<kendo:dataSource-schema-model-field name="isAllDay" type="boolean" />
<kendo:dataSource-schema-model-field name="recurrenceRule" type="string" nullable="true"/>
<kendo:dataSource-schema-model-field name="recurrenceId" type="number" nullable="true" />
<kendo:dataSource-schema-model-field name="recurrenceException" type="string" nullable="true" />-%>
</kendo:dataSource-schema-model-fields>
</kendo:dataSource-schema-model>
</kendo:dataSource-schema>
The generated HTML looks like the following:
<div
id="scheduler"></div><script>jQuery(function(){jQuery("#scheduler").kendoScheduler({"startTime":new
Date(2015,1,13,7,0,0,0),"resources":[{"field":"user_id","dataSource":{"data":[{"text":"Alex","color":"#f8a398","value":1},{"text":"Bob","color":"#51a0ed","value":2},{"text":"Charlie","color":"#56ca85","value":3}]},"title":"Owner"}],"dataSource":{"schema":{"model":{"id":"case_id","fields":{"hospital_name":{"type":"string","defaultValue":"No
title"},"end_date":{"type":"date"},"case_id":{"type":"number"},"user_id":{"defaultValue":1.0,"type":"number"},"start_date":{"type":"date"}}}},"transport":{"destroy":{"dataType":"json","contentType":"application/json","type":"POST","url":"/scheduler/index/destroy"},"update":{"dataType":"json","contentType":"application/json","type":"POST","url":"/scheduler/index/update"},"parameterMap":function
parameterMap(options, type) {
if (type === "read") {
debugger;
return JSON.stringify(options);
} else {
return JSON.stringify(options.models);
}
},"read":{"dataType":"json","contentType":"application/json","type":"GET","url":"/scheduler/index/read"},"create":{"dataType":"json","contentType":"application/json","type":"POST","url":"/scheduler/index/create"}},"batch":true,"filter":[{"filters":[{"field":"user_id","value":1.0,"operator":"eq"},{"field":"user_id","value":2.0,"operator":"eq"}],"logic":"or"}]},"timezone":"Etc/UTC","height":600.0,"views":[{"type":"day"},{"selected":true,"type":"workWeek"},{"type":"week"},{"type":"month"},{"type":"agenda"},{"type":"timeline"}],"date":new
Date(2015,1,13,0,0,0,0)});})</script>
</div>
I have an existing Spring MVC with Hibernate app and I would like to
integrate the JSP Scheduler into the app. I am currently having an issue
where none of my data is showing in the scheduler (please see the
attached screen shot).
Below are my steps. I just think I am missing something. Specifically, I
do not know if there is a specific client side javascript data model
that I have to map my data to with required model property names to make
sure the control renders. If I do have to follow a model, do you a link
to the documentation that describes what the required fields are etc
for the scheduler?
I have followed the samples included with the eval by installing the
scheduler controller, the jsp tag library jar and the index jsp page. I
modified the controller and jsp page to point to my existing models
instead of the sample models.
When I launch the page, the scheduler load but the loading spinner icon
just spins. So I checked the javascript console and i get the following:
Uncaught TypeError: undefined is not a function. kendo.all.min.js:9
I then checked the network tab of the developer tools to make sure the
page is loading my json data model from the server. It appears to load
as expected and looks like the following json:
[{"case_id":6,"status":"4","hospital_id":"4","doctor_id":"1","procedure_id":"1","user_id":"9","implant_id":null,"start_date":1393857600000,"end_date":1393857900000,"contact_lastname":"asl;kdjf","contact_midname":null,"contact_firstname":"asldkj","prefix":null,"suffix":null,"gender":"M","birth_date":"asdlk;fj","color":"rgb(235,147,115)","area_id":"3","products_selected":"68|1|0~69|1|0~","notes":"","po_number":"","tracking_number":"","wh_group_name":"LIMA","hospital_name":"St.Vincent Medical Center","procedure_name":"Shoulder
Replacement","doctor_name":null,"restock_track_no":null,"case_names":"New event"},blah blah]
Here is my code in the controller
@RequestMapping(value = {"/", "/index"}, method = RequestMethod.GET)
public String index(Locale locale, Model model) {
return "scheduler/index";
}
@RequestMapping(value = "/index/read", method = RequestMethod.GET)
public @ResponseBody List<CaseEntity> read() {
return caseEntity.getList();
}
The following is my jsp tags mapping the json to the kendo model.
<kendo:dataSource-schema>
<kendo:dataSource-schema-model id="caseId">
<kendo:dataSource-schema-model-fields>
<kendo:dataSource-schema-model-field name="case_id" type="number"/>
<kendo:dataSource-schema-model-field name="hospital_name" defaultValue="No title"
type="string"/>
<kendo:dataSource-schema-model-field name="user_id" type="number" defaultValue="1"/>
<kendo:dataSource-schema-model-field name="start_date" type="date"/>
<kendo:dataSource-schema-model-field name="end_date" type="date"/>
<%-- commented out as I am just try to display data at this moment-%>
<%--kendo:dataSource-schema-model-field name="description" type="string" />
<kendo:dataSource-schema-model-field name="isAllDay" type="boolean" />
<kendo:dataSource-schema-model-field name="recurrenceRule" type="string" nullable="true"/>
<kendo:dataSource-schema-model-field name="recurrenceId" type="number" nullable="true" />
<kendo:dataSource-schema-model-field name="recurrenceException" type="string" nullable="true" />-%>
</kendo:dataSource-schema-model-fields>
</kendo:dataSource-schema-model>
</kendo:dataSource-schema>
The generated HTML looks like the following:
<div
id="scheduler"></div><script>jQuery(function(){jQuery("#scheduler").kendoScheduler({"startTime":new
Date(2015,1,13,7,0,0,0),"resources":[{"field":"user_id","dataSource":{"data":[{"text":"Alex","color":"#f8a398","value":1},{"text":"Bob","color":"#51a0ed","value":2},{"text":"Charlie","color":"#56ca85","value":3}]},"title":"Owner"}],"dataSource":{"schema":{"model":{"id":"case_id","fields":{"hospital_name":{"type":"string","defaultValue":"No
title"},"end_date":{"type":"date"},"case_id":{"type":"number"},"user_id":{"defaultValue":1.0,"type":"number"},"start_date":{"type":"date"}}}},"transport":{"destroy":{"dataType":"json","contentType":"application/json","type":"POST","url":"/scheduler/index/destroy"},"update":{"dataType":"json","contentType":"application/json","type":"POST","url":"/scheduler/index/update"},"parameterMap":function
parameterMap(options, type) {
if (type === "read") {
debugger;
return JSON.stringify(options);
} else {
return JSON.stringify(options.models);
}
},"read":{"dataType":"json","contentType":"application/json","type":"GET","url":"/scheduler/index/read"},"create":{"dataType":"json","contentType":"application/json","type":"POST","url":"/scheduler/index/create"}},"batch":true,"filter":[{"filters":[{"field":"user_id","value":1.0,"operator":"eq"},{"field":"user_id","value":2.0,"operator":"eq"}],"logic":"or"}]},"timezone":"Etc/UTC","height":600.0,"views":[{"type":"day"},{"selected":true,"type":"workWeek"},{"type":"week"},{"type":"month"},{"type":"agenda"},{"type":"timeline"}],"date":new
Date(2015,1,13,0,0,0,0)});})</script>
</div>