Search results

Select a Sequence of Dates in Calendar in ASP.NET MVC Calendar control

20 Jan 2022 / 1 minute to read

The following example demonstrates how to select the week dates of chosen date in the Calendar using values property, when isMultiSelection property is enabled. Methods of Moment.js is used in this sample for calculating the start and end of week from the selected date.

Copied to clipboard

<div class='e-btn-group e-vertical'>
    @Html.EJS().Button("workweek").Content("Work Week").Render()

    function onChange(args) {
        calendar = document.getElementById('calendar').ej2_instances[0];
        var startOfWeek = moment(calendar.value).startOf('week');
        var endOfWeek = moment(calendar.value).endOf('week');
        if (calendar.element.classList.contains('workweek')) {
        else if (calendar.element.classList.contains("week")) {
            getWeekArray(startOfWeek, endOfWeek);
    function getWeekArray(startOfWeek, endOfWeek) {
        var days = [];
        var day = startOfWeek;
        while (day <= endOfWeek) {
            day = day.clone().add(1, 'd');
        calendar.values = days;

    document.addEventListener('DOMContentLoaded', function () {
        var calendar = document.getElementById('calendar').ej2_instances[0];

        /*selected current week dates when click the button*/
        document.getElementById('workweek').addEventListener('click', function () {
            if (calendar.element.classList.contains('week')) {
        /*selected current week dates when click the button*/
        document.getElementById('week').addEventListener('click', function () {
            if (calendar.element.classList.contains('workweek')) {
    .btncontainer {
        display: inline-block;
        float: right;
        margin-left: 85px;
        margin-top: 120px;
        margin-top: 25px;
Copied to clipboard
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;

// For more information on enabling MVC for empty projects, visit

namespace EJ2CoreSampleBrowser.Controllers
    public class CalendarController : Controller
        public ActionResult Multi()
            return View();