Material: dialog: this[0].focus is not a function

Created on 26 Oct 2015  路  6Comments  路  Source: angular/material

In some cases, confirmation dialogs give the message in the title. This happens when clicking both cancel and ok callbacks.

I have pinpointed the error to this line:

 if (!options.$destroy) options.origin.focus();
investigation bug

Most helpful comment

I solve this issue by set { targetEvent: null }

All 6 comments

Any chance you could provide a Codepen which shows this bug in action? It would really help us track down why the origin.focus() is causing an issue.

I think it has something to do with the dialog's targetEvent option, but I am not sure.

@EladBezalel Can you take a quick look? I think it's something in the getBoundingClientRect() function due to it returning focus : angular.bind(source, source.focus). Can possibly fix with source.focus || angular.noop but I'd like you to double-check my thinking on this.

@evoker a codepen would be very helpful!

@topherfangio sounds about right, when a codepen will be available let's take a look and see what's going on in there.

I Get the same error with material 1.0.0-rc2.
In my case it happens if i delete an element that will be removed from an ng-repeat after a confirm. (but i don't know if this really causes the issue).

I will try to reproduce this in an codepen.

Edit:
I was able to reproduce it, but it was also a bug on my side:
This will happen if you pass something invalid as ev-Parameter (an int for example).

Example:
http://codepen.io/anon/pen/MaBGyq

It only works if for the first element (if ev is 0), but crashes for every other element (just click the X).
So, it was only an bug on my side. even though it worked with previous angular-material versions.

I think this might be caused by the targetEvent. I have the same issue while i merged the targetEvent as following:

var defaults = {
        title: 'Confirm',
        content: '',
        event: null
};

var opts = angular.merge({}, defaults, data);

var confirm = $mdDialog.confirm()
            .title(opts.title)
            .textContent(opts.content)
            .targetEvent(opts.event)
            .ok('OK')
            .cancel('CANCEL');

$mdDialog.show(confirm);

Just use the original $event will be fine to solve this

@Tyrannmisu Of course you get this issue, you're sending the index as an event.

@leftstick you can try use angular.extend

I solve this issue by set { targetEvent: null }

Was this page helpful?
0 / 5 - 0 ratings