We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
BoldSignEasily embed eSignatures in your .NET applications. Free sandbox with native SDK available.
|
@import '../node_modules/@syncfusion/ej2-base/styles/material.css';
@import '../node_modules/@syncfusion/ej2-buttons/styles/material.css';
@import '../node_modules/@syncfusion/ej2-calendars/styles/material.css';
@import '../node_modules/@syncfusion/ej2-dropdowns/styles/material.css';
@import '../node_modules/@syncfusion/ej2-inputs/styles/material.css';
@import '../node_modules/@syncfusion/ej2-lists/styles/material.css';
@import '../node_modules/@syncfusion/ej2-popups/styles/material.css';
@import '../node_modules/@syncfusion/ej2-navigations/styles/material.css';
@import '../node_modules/@syncfusion/ej2-angular-schedule/styles/material.css'; |
|
let roomElement: HTMLInputElement = args.element.querySelector('#RoomId');
if (!roomElement.classList.contains('e-multiselect')) {
let roomObject: MultiSelect = new MultiSelect({
placeholder: 'Choose a owner',
fields: { text: 'RoomText', value: 'Id' },
dataSource: (this.roomDataSource as any),
value: <string[]>(((args.data as any).RoomId instanceof Array) ? (args.data as any).RoomId : [(args.data as any).RoomId])
});
roomObject.appendTo(roomElement);
}
let ownerElement: HTMLInputElement = args.element.querySelector('#OwnerId');
if (!ownerElement.classList.contains('e-multiselect')) {
let ownerObject: MultiSelect = new MultiSelect({
placeholder: 'Choose a owner',
fields: { text: 'OwnerText', value: 'Id' },
dataSource: (this.ownerDataSource as any),
value: <string[]>(((args.data as any).OwnerId instanceof Array) ? (args.data as any).OwnerId : [(args.data as any).OwnerId])
});
ownerObject.appendTo(ownerElement);
} |
|
if (args.target.classList.contains('e-work-cells')) {
let subjectElement: HTMLInputElement = args.element.querySelector('#Subject') as HTMLInputElement;
subjectElement.value = "Enter some text";
} |
|
<input id="StartTime" class="e-field" type="text" name="StartTime" autofocus /> |
|
var dialog = (args.element as any).ej2_instances[0];
dialog.open = function () {
(args.element.querySelector('.e-schedule-dialog #RoomId') as any).ej2_instances[0].refresh();
(args.element.querySelector('.e-schedule-dialog #OwnerId') as any).ej2_instances[0].refresh();
}; |
|
@import '../node_modules/@syncfusion/ej2-base/styles/material.css';
@import '../node_modules/@syncfusion/ej2-buttons/styles/material.css';
@import '../node_modules/@syncfusion/ej2-calendars/styles/material.css';
@import '../node_modules/@syncfusion/ej2-dropdowns/styles/material.css';
@import '../node_modules/@syncfusion/ej2-inputs/styles/material.css';
@import '../node_modules/@syncfusion/ej2-lists/styles/material.css';
@import '../node_modules/@syncfusion/ej2-popups/styles/material.css';
@import '../node_modules/@syncfusion/ej2-navigations/styles/material.css';
@import '../node_modules/@syncfusion/ej2-angular-schedule/styles/material.css'; |
|
onPopupOpen(args: PopupOpenEventArgs): void {
if (args.type === 'QuickInfo') {
const dialogObj = (args.element as any).ej2_instances[0];
dialogObj.hide();
const currentAction = args.target.classList.contains("e-work-cells") ? "Add" : "Save";
this.scheduleObj.openEditor(args.data, currentAction);
}
} |
|
public customFn(args: any): Boolean {
// It allows to select the date only a year in 2018
return (new Date(args.element.value).getFullYear() === 2018);
}
onPopupClose(args: PopupCloseEventArgs): void {
if (args.type === 'Editor') {
var letters = /^[A-Za-z]+$/;
var firstChar = (args.data as any).Subject.charCodeAt(0);
if (!(args.data as any).Subject.match(letters)) {
alert('Please enter alphabets only');
args.cancel = true;
}
}
} |
|
public onPopupOpen(args: PopupOpenEventArgs): void {
if ((!args.target.classList.contains('e-appointment') && (args.type === 'QuickInfo')) || (args.type === 'Editor')) {
args.cancel = this.onEventCheck(args);
}
}
public onEventRendered(args: EventRenderedArgs): void {
args.cancel = this.onEventCheck(args);
}
public onActionBegin(args: ActionEventArgs): void {
if ((args.requestType === 'eventCreate') || args.requestType === 'eventChange') {
args.cancel = this.onEventCheck(args);
}
}
public onEventCheck(args: any): boolean {
let eventObj: any = args.data instanceof Array ? args.data[0] : args.data;
let currentDate: Date = new Date(new Date().setHours(0, 0, 0, 0));
let eDate: Date = new Date(new Date(eventObj.StartTime).setHours(0, 0, 0, 0));
return (eDate < currentDate);
}
public onRenderCell(args: RenderCellEventArgs): void {
let currentDate: Date = new Date(new Date().setHours(0, 0, 0, 0));
let eDate: Date = new Date(new Date(args.date).setHours(0, 0, 0, 0));
if (args.elementType == "dateHeader" || args.elementType == "workCells") {
if (eDate < currentDate) {
args.element.classList.add('disable-dates');
}
}
} |
|
onPopupOpen(args: PopupOpenEventArgs): void {
if (args.type === 'QuickInfo') {
const dialogObj = (args.element as any).ej2_instances[0];
dialogObj.hide();
const currentAction = args.target.classList.contains('e-work-cells') ? 'Add' : 'Save';
this.scheduleObj.openEditor(args.data, currentAction);
}
if (args.type === 'Editor') {
const formElement: HTMLElement = args.element.querySelector('.e-schedule-form');
const validator: FormValidator = ((formElement as EJ2Instance).ej2_instances[0] as FormValidator);
validator.dataBind();
// To open editor window with fixed value
const subjectElement: HTMLInputElement = args.element.querySelector('#Subject') as HTMLInputElement;
subjectElement.value = (args.data as any).Subject || 'Enter some text';
const emailElement: HTMLInputElement = args.element.querySelector('#Email') as HTMLInputElement;
emailElement.value = (args.data as any).Email || '';
// To email address validation
validator.addRules('Email', { email: [true] });
const statusElement: HTMLInputElement = args.element.querySelector('#EventType') as HTMLInputElement;
if (!statusElement.classList.contains('e-dropdownlist')) {
const dropDownListObject: DropDownList = new DropDownList({
placeholder: 'Choose status', value: statusElement.value,
dataSource: ['New', 'Requested', 'Confirmed']
});
dropDownListObject.appendTo(statusElement);
statusElement.setAttribute('name', 'EventType');
}
const startElement: HTMLInputElement = args.element.querySelector('#StartTime') as HTMLInputElement;
if (!startElement.classList.contains('e-datetimepicker')) {
new DateTimePicker({ value: new Date(startElement.value) || new Date() }, startElement);
}
const endElement: HTMLInputElement = args.element.querySelector('#EndTime') as HTMLInputElement;
if (!endElement.classList.contains('e-datetimepicker')) {
new DateTimePicker({ value: new Date(endElement.value) || new Date() }, endElement);
}
}
} |
|
public minDate: Date = new Date(new Date().setHours(0, 0, 0, 0));
public selectedDate: Date = new Date(new Date().setHours(0, 0, 0, 0)); |
|
<tr>
<td class="e-textlabel">Email</td>
<td colspan="4">
<input id="Email" class="e-field e-input" type="text" value="" name="Email" style="width: 100%" autofocus />
</td>
</tr> |
|
public group: GroupModel = {
resources: ['Categories'], enableCompactView: false
}; |
|
const reasonElement: HTMLInputElement = args.element.querySelector('#Description') as HTMLInputElement;
reasonElement.value = 'This is not an editable field';
reasonElement.setAttribute('disabled', 'true'); |
