Comments (12)
Thanks @nikolalsvk . I just tested version 2.1.6 in my project and your project. it works!.
from render_async.
Hey! Just had a similar problem when I changed from 1.2.0 to 2.0.0 since I was using the jQuery version and in 2.0.0 it became disabled by default. I managed to fix it by just configuring the gem to use jQuery.
It's related to #30 indeed. I had a <script>
inside the partial and it just didn't run when added to the DOM, which seems to be the default browser behavior for security reasons. It works with jQuery because it evaluates the inner script tags. There doesn't need to be a simple solution for the vanilla JS part though. :\
from render_async.
Thanks for commeting @filipewl! You explained the situation really well for loading script tags to the DOM.
To sum up again, if you want to have your nested <script>
tags load with render_async
, you need to turn on jQuery for now. Or help me fix #30 😄
from render_async.
Hey, @ye-lin-aung, thanks for commenting!
I just tried doing a similar thing with a Rails 6 base app I created quickly, can you give it a go and see if it works for you? Here's the app code https://github.com/nikolalsvk/rails-6-base-app
from render_async.
Thanks, again, @ye-lin-aung! I fixed the issue you mention with Turbolinks and nested partials here #114
I will be releasing new version soon and will let you know to try it out if it works.
EDIT: Just released 2.1.6, please, let me know if it works there 🙇
from render_async.
Hey @chadwtaylor, thanks for submitting the issue!
Can't help but wonder if it's because the JS is dynamically added by the parent and then not firing because it has been added after page load?
I think it is, I'll try to reproduce this myself and come up with a fix for it :)
from render_async.
Now that I'm looking into it, seems like the problem is in the Vanilla JS part. script tag that is returned from parent render_async response doesn't get evaluated in the HTML, thus is not being called.
It's related to this issue #30
As a quick fix, you can turn on the jQuery in your config if you're using it in your project.
I'll try to make this work for Vanilla JS hopefully.
from render_async.
Hi.
Same problem here.
I tryed some versions.
No Probrem:
render_async: v1.2.0
render_async: v1.3.0
Has Probrem:
render_async: v1.4.0
render_async: v2.0.0
from render_async.
Hi, I've been searching for a while on how to solve my issue.
I'm using the 2.1.2
My App is using JQuery and I already enabled it
RenderAsync.configure do |config|
config.jquery = true # This will render jQuery code, and skip Vanilla JS code
config.turbolinks = true # Enable this option if you are using Turbolinks 5+
end
This is my scenario:
The page will load let say 200 rows of data,
I want to load it per batch (5 rows per batch)
there will be a checking per row, this is where i use the render_async
index.html.erb
<div id="data-result">
<% @datas do |data| %>
<%= render :partial => 'data_partial', locals: {data: data} %>
<% end %>
<div>
# When clicked, it should repond to js format
<%= link_to same_path(page: (@page + 1)), remote: true do %>
Get More Data
<% end %>
index.js.erb
<% @datas do |data| %>
$("#search-results").append("<%= j render :partial => 'data_partial', locals: {data: data} %>")
<% end %>
_data_partial.html.erb
<div >
<%= render_async check_data_path(data: data) do %>
checking...
<% end %>
</div>
The initial load is ok (for the first batch). But when I click the Get More Data
button, partial was appended but the it was stuck in the placeholder. It does not go back to the controller path to check and eventually update the row.
I referred to #75 conversation, I though it was my same case. But it seems not.
Any help will be much appreciated. Thanks!
from render_async.
Hey @kian1213, thanks for submitting the comment to this issue. Also, thank you for detailed explanation on what are you trying to do, and why you think it's failing.
A potential solution would be when using nested render_async calls. It's described what is needed when you nest render_async's.
Let me know how it goes :)
from render_async.
Hi. I was testing the gem today. I follow the code as in nested render async calls but seems like its not working. I tried enabling jquery and also still not working. I was using rails 6 with 2.1.5 render_async
posts/index.html.erb
<p id="notice"><%= notice %></p>
<h1>Posts</h1>
<%= render_async list_posts_path %>
<br>
<%= link_to 'New Post', new_post_path %>
posts/_list.html.erb
<table>
<thead>
<tr>
<th>Title</th>
<th>Description</th>
<th colspan="3"></th>
</tr>
</thead>
<tbody>
<% @posts.each do |post| %>
<%= post.title %>
<%= render_async post_path(post) %>
<% end %>
</tbody>
</table>
<%= content_for :render_async %>
posts/show.html.erb
<p id="notice"><%= notice %></p>
<p>
<strong>Title:</strong>
<%= @post.title %>
</p>
<p>
<strong>Description:</strong>
<%= @post.description %>
</p>
<%= link_to 'Edit', edit_post_path(@post) %> |
<%= link_to 'Back', posts_path %>
I noticed that the nested script got inserted but not executed
from render_async.
@nikolalsvk It works now. Both the example and my app works now. RenderAsync.configuration.turbolinks = true
is causing the issue. its hooking turbolinks:load callback but in nested form turbolinks:load callback seems to executed before the nested page was loaded. You can see enabling RenderAsync.configuration.turbolinks = true
will not execute nested pages '_renderAsyncFunction' callbacks
from render_async.
Related Issues (20)
- 2.1.5 breaks manual trigger of click event HOT 13
- preventDefault() in toggle code interferes with other UI functionality HOT 2
- Feature idea: Render async with ActiveJob & ActionCable HOT 2
- Render_async on header HOT 2
- Duplication of injected JS for nested async templates HOT 1
- Start polling immediately option when toggle is specified HOT 1
- Manual retry based on JS event HOT 3
- Idea: only fire the AJAX request on scroll (Lazy Partials) HOT 1
- Event driven reloads. HOT 3
- Polling: vanilla js has code that runs before document has finished loading HOT 2
- Feature request: Refresh with event HOT 5
- Feature: Append or prepend content on toggle HOT 1
- Content flashes on page revisit even with Turbolinks enabled HOT 6
- render_async issues with container_id and turbolinks : not reloading or JS not firing on new visit depending on configuration HOT 5
- Add Support for Turbo HOT 3
- Add delay before performing async call HOT 4
- content_for :render_async does nothing. HOT 1
- With Caching enabled, event_name is not triggered as content_for is missing on page reload HOT 5
- Turbo: Toggable selector not executing the event_listener function set by _setUpToggle on a new visit HOT 1
- JS scripts not loading synchronously HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from render_async.