How to add the EJMVC Schedule control in the MVC application?

Platform: ASP.NET MVC |

Control: Schedule

The following steps help manually add the EJMVC Schedule control into the new MVC 5 application.

Create the MVC 5 application in the Visual Studio.
Add references of the necessary assemblies to your project as depicted in the following screenshot.

Necessary assembly reference

Figure 1:Necessary assembly reference

Add the necessary assembly information in the root web.config file.

[Web.config]

</assemblies>

</compilation>

Add the namespaces in the root Web.config page as follows.

[Web.config]

<pages>

</namespaces>

</pages>

Also, add the following highlighted namespaces in the Web.config page available under the Views/Shared folder of your project.

[Web.config]

</namespaces>

Add the necessary scripts and theme files in the sample application as depicted.

Adding necessary themes

Figure 2: Adding necessary themes

Adding necessary scripts

Figure 3: Adding necessary scripts

Add references to the required scripts and stylesheets in the layout.cshtml page as follows.

[Layout.cshtml]

<link href="~/Content/ej/default-theme/ej.widgets.all.min.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-2.1.4.min.js"></script>
    <script src="~/Scripts/jsrender.min.js"></script>
    <script src="~/Scripts/jquery.easing-1.3.min.js"></script>
    <script src="~/Scripts/jquery.globalize.min.js"></script>
    <script src="~/Scripts/ej/ej.web.all.min.js"></script>

Set the UnobtrusiveJavaScriptEnabled property to false in the web.config page as follows.

[Web.config]

</appSettings>

Add the script manager render code at the end of the body tag in the layout.cshtml page as mentioned in the following code example. It is mandatory for rendering the EJMVC Schedule control.

[Layout.cshtml]

<body>
    ------------------------
    ------------------------
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)
    @Html.EJ().ScriptManager()
</body>

To render the Schedule control, add the schedule code in the view page as follows.

[Index.cshtml]

@Html.EJ().Schedule("Schedule")

After running the above code, the Schedule control is displayed as follows.

Schedule control

Figure 4: Schedule control

Sample Link

ScheduleSampleManual

2X faster development

The ultimate ASP.NET MVC UI toolkit to boost your development speed.

Free Trial

Did you find this information helpful?

CONTACT US

How to add the EJMVC Schedule control in the MVC application?

Please sign in to access our KB

CONTACT US