Smart UI Components & Libraries – Grid, Scheduler, Gantt, Kanban for Angular, React, Next.js, Vue, Blazor, JavaScript › Forums › Data Grid › Custom "Add Column Window" › Reply To: Custom "Add Column Window"
		September 20, 2021 at 6:04 am
		
		#102236
		
		
		
	
Member
		
		
	Hi Trist B,
I have create a quick code snippet showcasing how to add the event listeners so that it may simulate the ‘closeColumnDialog’ and ‘openColumnDialog’ events.
	 componentDidMount() {
			const addColumnButton = document.querySelector('.smart-add-new-column');
			addColumnButton.addEventListener('click', () => {
				console.log('opening column dialog');
				setTimeout( () => {
					let dialogWindow = document.querySelector('.smart-window'),
						closeButtons = dialogWindow.querySelectorAll('.smart-cancel-button');
						for(let i=0; i< closeButtons.length; i++) {
							closeButtons[i].addEventListener('click', () => {
								console.log('closing dialog')
							});
						}
				},100)
			});
	 }
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/