Is it possible to use Slideouts just as an informative view, without save actions?

[gopeter]

I'm building a slideout into my plugin and want to create something like a "more details" view. But slideouts always have "Cancel" and "Save" buttons. Is there a way to customize this?

[brandonkelly]

Yes, you can create a slideout manually via JavaScript, and put whatever you want in them:

const mySlideout = new Craft.Slideout('<p>Hello</p>');

For example, field layout designers will create slideouts for showing field layout element settings:

cms/src/web/assets/cp/src/js/FieldLayoutDesigner.js

Lines 344 to 372 in 1b2dd98

	async createSlideout(data, js) {
	const $body = $('<div/>', {class: 'fld-element-settings-body'});
	$('<div/>', {class: 'fields', html: data.settingsHtml}).appendTo($body);
	const $footer = $('<div/>', {class: 'fld-element-settings-footer'});
	$('<div/>', {class: 'flex-grow'}).appendTo($footer);
	const $cancelBtn = Craft.ui
	.createButton({
	label: Craft.t('app', 'Close'),
	spinner: true,
	})
	.appendTo($footer);
	Craft.ui
	.createSubmitButton({
	class: 'secondary',
	label: Craft.t('app', 'Apply'),
	spinner: true,
	})
	.appendTo($footer);
	const $contents = $body.add($footer);
	const slideout = new Craft.Slideout($contents, {
	containerElement: 'form',
	containerAttributes: {
	action: '',
	method: 'post',
	novalidate: '',
	class: 'fld-element-settings',
	},
	});

[gopeter]

Ah perfect, thanks a lot!