Do you know how we can run some JS when form appends? I'm using selectize, the first time works with turbo:loads, but not then because turbo just fires when the history changes :/
I don’t know how...yet. I had same issue with wanting to trigger showing the modal when it was finished rendering. In my case I hacked it with a 200ms timeout in the post-modal controller. Maybe someone will come along with an a solution.
So I have an initial work-around - not what I'd consider a final solution(it works), so I opened an Merge Request while I think about it more - should likely try to figure out what magic connect is using instead of creating a new stimulus controller.
And here is more of the turbo way to do it, though I have some reservations that it is the event I need to listen to...will have to try initializing something JS wise like a select element to feel confident in this approach
Thank you, for providing great feedback that helped with the iteration here! I tried this solution with slim select and of course the customary console.log debugging and it seems to work for me, so I merged it and updated the blog post.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Do you know how we can run some JS when form appends? I'm using selectize, the first time works with turbo:loads, but not then because turbo just fires when the history changes :/
I don’t know how...yet. I had same issue with wanting to trigger showing the modal when it was finished rendering. In my case I hacked it with a 200ms timeout in the post-modal controller. Maybe someone will come along with an a solution.
Hahaha yes, I think that too but it didn't works in slow conections
So I have an initial work-around - not what I'd consider a final solution(it works), so I opened an Merge Request while I think about it more - should likely try to figure out what magic
connectis using instead of creating a new stimulus controller.gitlab.com/doug.stull/turbo_modal/...
edit:
And here is more of the
turboway to do it, though I have some reservations that it is the event I need to listen to...will have to try initializing something JS wise like a select element to feel confident in this approachgitlab.com/doug.stull/turbo_modal/...
This is my temporary solution (it sucks, i know 😂):
$(document).on("turbo:before-fetch-response", function(){var checkExist = setInterval(function () {
if ($('.selectize#item_category_ids').length) {
$(".selectize#item_category_ids").selectize({
create: function (input, callback) {
$.ajax({
method: "POST",
url: "/categories.json",
data: { category: { name: input } },
success: function (response) {
// call callback with the new item
callback({ value: response.id, text: response.name });
}
});
},
});
clearInterval(checkExist);
}
}, 100);
});
I don't think it is that bad actually.
However, I think this is the correct solution
see my latest commit on gitlab.com/doug.stull/turbo_modal/...
reasoning:
connectis the only thing that is sure that the stream as finished rendering.See if that works for you?
Awesome, thank you!
Thank you, for providing great feedback that helped with the iteration here! I tried this solution with slim select and of course the customary
console.logdebugging and it seems to work for me, so I merged it and updated the blog post.