New to Kendo UI for jQueryStart a free 30-day trial

Remove 'None' option in DropdownList of Kendo UI Scheduler Popup Editor

Environment

Product Version2019.2.619
ProductProgress® Kendo UI® Scheduler for jQuery

Description

How can I prevent having 'None' as an option and as a default value in the DropdownList of the Scheduler Popup Editor Form?

Solution

  1. Hide the 'None' option by setting the display to none for the selector 'div.k-list-optionlabel'.

    css
    	div.k-list-optionlabel {
    	  display: none;
    	}
  2. Set the 'defaultValue' in the schema.model.fields.fieldName.

    javascript
    	schema: {
    	  fields: {
    	    roomId: { from: "RoomID", defaultValue: 1 }
    	  }
    	}
  3. By default, the 'nullable' parameter is set to false as seen in the Model.define method. You can also set the 'nullable' parameter to false.

    javascript
    	schema: {
    	  fields: {
    	    roomId: { from: "RoomID", nullable: false }
    	  }
    	}

Example

	<style>
	    div.k-list-optionlabel {
	      display: none;
	    }
	</style>

	<div id="example" class="k-content">
	    <div id="scheduler"></div>
	</div>

	<script>
	$(function() {
	    $("#scheduler").kendoScheduler({
		date: new Date("2025/6/13"),
		startTime: new Date("2025/6/13 07:00 AM"),
		height: 600,
		views: [
		    "day",
		    { type: "week", selected: true },
		    "month",
		    "agenda",
		    "timeline"
		],
		timezone: "Etc/UTC",
		dataSource: {
		    batch: true,
		    transport: {
			read: {
			    url: "https://demos.telerik.com/service/v2/core/meetings"
			},
			update: {
			    url: "https://demos.telerik.com/service/v2/core/meetings/update",
			     type: "POST",
                 contentType: "application/json"
			},
			create: {
			    url: "https://demos.telerik.com/service/v2/core/meetings/create",
			     type: "POST",
                 contentType: "application/json"
			},
			destroy: {
			    url: "https://demos.telerik.com/service/v2/core/meetings/destroy",
			     type: "POST",
                 contentType: "application/json"
			},
			parameterMap: function(options, operation) {
			    if (operation !== "read" && options.models) {
				return kendo.stringify(options.models);
			    }
			}
		    },
		    schema: {
			model: {
			    id: "meetingID",
			    fields: {
				meetingID: { from: "MeetingID", type: "number" },
				title: { from: "Title", defaultValue: "No title", validation: { required: true } },
				start: { type: "date", from: "Start" },
				end: { type: "date", from: "End" },
				startTimezone: { from: "StartTimezone" },
				endTimezone: { from: "EndTimezone" },
				description: { from: "Description" },
				recurrenceId: { from: "RecurrenceID" },
				recurrenceRule: { from: "RecurrenceRule" },
				recurrenceException: { from: "RecurrenceException" },
				roomId: { from: "RoomID", defaultValue: 1 },
				attendees: { from: "Attendees", nullable: true },
				isAllDay: { type: "boolean", from: "IsAllDay" }
			    }
			}
		    }
		},
		resources: [
		    {
			field: "roomId",
			dataSource: [
			    { text: "Meeting Room 101", value: 1, color: "#6eb3fa" },
			    { text: "Meeting Room 201", value: 2, color: "#f58a8a" }
			],
			title: "Room"
		    }
		] 
	    });
	});
	</script>

See Also