Disable Save button in Task Editor if field fails validation

[vaughn]

Hello,

I am trying to add validation in the "Resources" tab of the task editor to make sure that all selected assignees meet our custom criteria. I was able to add the custom validation and successfully mark the field as valid/invalid based on the results of the validation function as follows:

            resourcesTab: {
                title: 'Assignees',
                showUnits: false,
                items: {
                    grid: {
                        columns: {
                            data: {
                                resource: {
                                    text: 'Assignee',
                                    finalizeCellEdit: () => {
                                        // perform validation
                                    },
                                },
                                units: false,
                            },
                        },
                    },
                },
            },

However, the issue is that when a field is marked as invalid, it does not disable the Task Editor save button. If the user clicks the save button, it won't save the invalid data, but it will save whatever the last valid state happened to be, which can lead to unexpected behavior. Is there a way to make sure that if a field is marked as invalid using finalizeCellEdit, to make sure that the Task Editor "Save" button is disabled until the error is resolved?

[marcio]

Hey vaughn,

Thanks for reaching out and welcome to our forums!

To disable the save button based on some validation, you can use the following snippet:

finalizeCellEdit: () => {
	// perform validation
	if(validation) {
		// disable the button
		gantt.features.taskEdit.editor.widgetMap.saveButton.disabled = true;
	} else {
		// enable the button
		gantt.features.taskEdit.editor.widgetMap.saveButton.disabled = false;
	}
}

I tested adding your snippet with the code that I shared here in our demo https://bryntum.com/products/gantt/examples/taskeditor/

[vaughn]

thank you! I actually don't have the gantt object in scope in the place that I'm defining this function, but I was able to access it via the args passed to finalizeCellEdit, and was able to get it working. Thanks!