JQuery for page not functioning until second view...

[planetrocke]

I have custom JS firing to run a simple select2() (jQuery extension) for selects. I've put it many places in my detail.js (edit view, after-edit change, etc) but it doesn't run until I look at the Edit screen at least once. How do i get it to consistently fire from the first time out? I understand for things like button clicks I can use .on functionality to prevent a race condition or whatever is happening, but how do I do this for this? I'm sure it is an event I am overlooking (I hope anyway).

this.on('after:render', function () {
this.$detailButtonContainer = this.$el.find('.detail-button-container');
this.$dropdownItemListButton = this.$detailButtonContainer.find('.dropdown-item-list-button');
// this only fires after the first line
this.$el.find('select.form-control.main-element').select2();
}, this);

[planetrocke]

I hooked it up to the fieldRender piece and I'm closer, but any advice would be awesome.

[planetrocke]

OK, I was able to figure it out based on a reference in the detail-middle JS.

I added this inside the field loop of setEditMode. I hope this helps others.

fieldView.on('after:render', function () {
console.log("AFTER");
$("select").select2();
}, this);

[esforim]

Ignorant question here, what does this do? I read your first post but not sure what it does. Reading through it, it seem to "Select" something after you click "Edit"?

[telecastg]

Thanks for posting your solution !. It really helps everyone when we can see code examples.

For future reference, you might want to check this post that provides a "map" of scripts that control the entity's detail display https://forum.espocrm.com/forum/deve...-s-detail-view