inteference between two typeaheads on same page with dynamicFilter

[tamw]

Hi,
I seem to have the same problem as mentioned in issue #200 in the comments. The original issue may be fixed but the 'related?' one in the comment still seems broken in version 2.11.00:

Apparently I get the same error when I have two typeaheads with dynamicFilter on 1 page ???

If I have two typeaheads on the same page both using a dynamicFilter, when the second initialises it has this.dynamicFilter.isEnabled = true ... which causes data to load before the container is set resulting in,

Uncaught TypeError: Cannot read property 'addClass' of null
    at Typeahead.generateSource (jquery.typeahead.js:846)
    at Typeahead.set (jquery.typeahead.js:2962)

I fixed locally by adding this line number 223:

this.displayEmptyTemplate;          // Display the empty template in the result list
this.dynamicFilter.isEnabled = false; //20200805 TRW: Bug fix?: clear the dynamic filter from earlier typeaheads before constructing the new one
this.__construct();

I'm not sure that's the best fix, but it works for me as far as I can tell.

I hope I've logged this in the right way - I'm new to this. Sorry I can't easily attach code snippet from my code. If needed I'll construct a simple example to help check it is an issue and resolve.

Thanks for a great plugin.

[tombertrand]

hey @tamw, can you fork a Typeahead starter from CodeSandbox and provide an example showing the issue? Depending on the options you are using we might have very different results

[tamw]

Hi @tombertrand , I think I've done what you asked correctly. It took a while to reproduce with a simple example, it seems that another pertinent factor is minLength set to 0.

I had some trouble with CodeSandbox which seems to cache things for a while, but this fork shows the issue if you edit minLength to be 0 on both typeaheads. I don't know why but on CodeSandbox you only have to set one typeahead to minLength 0 to get the error, but in a real website that is not the case - both typeaheads are needed.

I hope I have this right that it is a real issue and it is not just my bad js skills.

[tombertrand]

hey @tamw could you validate this fix b8be530 ? this.dynamicFilter.isEnabled = false; was on the prototype instead of being on the instance as you have noticed 👍

[tamw]

hey @tamw could you validate this fix b8be530 ? this.dynamicFilter.isEnabled = false; was on the prototype instead of being on the instance as you have noticed 👍

Thanks @tombertrand - yes I can confirm that commit fixes the issue on my test app and in my application. That fix is proper compared to my hack too. Thanks so much. I apologise I was slow to reply.
(Not sure if I close and comment or just comment - I'm happy for this ticket to be closed)

[tombertrand]

no worries I'll take on from here 2.11.1 has been published