Untitled

view: "form",
localId: "popupForm",
css: "create-campaign-popup-form",
paddingX: 24,
elements: [
	{
		view: "label",
		label: "Panel Size",
		css: "basicInfoLabel"
	},
	{
		cols: [
			{
				view: "text",
				label: "Width / Height Size, mm",
				labelWidth: 200,
				name: "width",
				required: true,
				localId: "widthField",
				placeholder: "Width",
				validateEvent: "key",
				type: "number",
				width: 360
			},
			{
				view: "template",
				template: "<div style=\"margin-top:6px;\">x</div>",
				width: 30,
				borderless: true,
				css: {background: "transparent"}
			},
			{
				view: "text",
				label: "",
				name: "height",
				required: true,
				localId: "heightField",
				placeholder: "Height",
				validateEvent: "key",
				type: "number",
				width: 160
			}
		]
	}
],
rules: {
	width: webix.rules.isNotEmpty,
	height: webix.rules.isNotEmpty
},
on: {
	onChange: () => this.validate(),
	onValidationSuccess: () => {
		console.log(this.$$("popupForm").getValues());
		console.log("success");
	},
	onValidationError: () => {
		console.log("error");
	}
}