Unable to focus on any text fields

[lclyman]

There doesn't seem to be any way to focus on any input fields in form-wizard. I've tried autofocus on individual text inputs as well as a Vue directive that automatically places the focus on the element.

I've also directed the focus to the first text input in the mounted hook via document.getElementById('element name').focus() with no luck.

It would be great if this could be addressed..

Thanks

[froamer]

I did this...

<form-wizard @on-change="tabChanged">
...
tabChanged(oldIndex, newIndex) {
  switch (newIndex) {
	  case 0:
		  this.$refs.name.focus()
		  break;
	  case 1:
		  this.$refs.address1.focus()
		  break;
	  case 2:
		  this.$refs.interests.focus()
		  break;
  }
}

[lundie]

I'm having the same issue. Even with @froamer's code, I am unable to get it to work. The event is firing, but it seems to be before the tab has actually changed, so I'm wondering if that could be causing the problem where the form input isn't getting focus? I am able to set the focus within the mounted() call.

Thanks

[boruchsiper]

It would be nice if there was a onEnter event for the steps to handle this requirement.

[boruchsiper]

I did this...

<form-wizard @on-change="tabChanged">
...
tabChanged(oldIndex, newIndex) {
  switch (newIndex) {
	  case 0:
		  this.$refs.name.focus()
		  break;
	  case 1:
		  this.$refs.address1.focus()
		  break;
	  case 2:
		  this.$refs.interests.focus()
		  break;
  }
}

The workaround is to put the focus code into a setTimeout function with delay of 400. But this is not ideal.