I was able to run the Drag Drop From a Grid example
https://www.bryntum.com/examples/schedul ... gdrop.html
in local server.
However, I got lots of 'Resource interpreted as Script but transferred with MIME type text/html' error when I tried to integrate the code into a salesforce apex page. I did upload all the javascript and css source files into a static resource package in salesforce.
we've used bryntum component in other apex pages and they works. The only difference this time is the MVC.
I even tried to add all the file references like the way below:
<apex:page showHeader="true" sidebar="true">
<head>
<apex:stylesheet value="{!URLFOR($Resource.ConnectWeb, 'scripts/extdragdrop/resources/css/ext-all.css')}" />
<!--Scheduler styles-->
<apex:stylesheet value="{!URLFOR($Resource.ConnectWeb, 'scripts/extdragdrop/resources/css/sch-all.css')}" />
<apex:stylesheet value="{!URLFOR($Resource.ConnectWeb, 'scripts/extdragdrop/resources/css/style.css')}" />
<!--Ext 4 includes, NOTE: When you debug this example you should use ext-all-dev.js -->
<!--<script src="../../../extjs-4.1.1/ext-all-dev.js" type="text/javascript"></script>-->
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/ext-all.js')}" />
<!--Scheduler files-->
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/sch-all-debug.js')}" />
<!--Application files-->
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/app.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/controller/EmployeeScheduler.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/dummydata/availabilitydata.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/dummydata/eventdata.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/dummydata/resources.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/dummydata/unplanned.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/model/Resource.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/model/UnplannedTask.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/store/AvailabilityStore.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/store/EventStore.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/store/ResourceStore.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/store/UnplannedTaskStore.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/view/AvailabilityGrid.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/view/EmployeeScheduler.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/view/SchedulerDropZone.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/view/UnplannedTaskDragZone.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/view/UnplannedTaskDropZone.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/view/UnplannedTaskGrid.js')}" />
<apex:includeScript value="{!URLFOR($Resource, 'scripts/extdragdrop/lib/view/Container.js')}" />
</head>
<div id="example-description" class="x-hidden">
<p>This sample is an advanced example of how you can drag and drop tasks onto a scheduler panel. It also has
different availabilities setup for the resources. The availability management is a bit simplified but it will
give you an idea of how you can implement this. Once a task is dragged onto the schedule, it's constrained to
the resource (using the <i>constrainDragToResource</i> config option).
Note that the js for the example code is not minified so it is readable. See <a href="app.js">app.js</a>.
</p>
</div>
</apex:page>
Any ideas?
Thanks!
David