Form doesn't seem to work in partial

[Siggs2000]

Hey all, love this gem!

I'm getting a confusing issue for one of my uses though. In my partial, I'm loading a table of data and in each row, I have a form_tag. This works nicely in my old, regular partial but when I load it async, using this gem, the form fields don't render and the submit button doesn't trigger any action when pressed.

Here's an example of my code:

# CONTROLLER ACTIONS:
  def new
    @role = MemberRole.find(params[:member_role_id])
  end

  def api_available_projects
    @integration_project = IntegrationProject.new(project_params)
    @repos = ListIntegrationProject.new(current_user.get_data).call
  end

    render partial: "api_available_projects"
  end

 # View new.html.erb
<%= render_async api_available_projects_path(member_role_id: params[:member_role_id]) %>

# View api_available_projects.html.erb
<div class="scrolly">
  <table class="table table-responsive table-bordered table-dark">
    <tr>
      <th>Name</th>
      <th>Access Level</th>
      <th>Actions</th>
    <tr>
      <% @repos.each do |repo| %>
 
            <tr>
              <%= form_tag integration_projects_path(repo: repo), :method => :post do %>
                <td><%= repo[:name] %></td>
                <td><%= select_tag 'access_level', options_for_select(Integration.access_types) %></td>
                <td><%= submit_tag %></td>
              <% end %>
            </tr>
  
      <% end %>
  </table>
</div>

[nikolalsvk]

Hey @Siggs2000, thanks for opening the issue, also thank you for posting code related to it.

If I understand correctly, your form fields do not render, but submit tag renders (and it's not functional)?

[Siggs2000]

@nikolalsvk - that's exactly right.

Some other info:

My initializer is set with the following:

RenderAsyn.configure do |config|
  config.jquery = true
  config.turbolinks = false # also turbolinks is removed from the entire app anyway
end

If I load the partial in the browser directly (ex: .../api_available_projects) the form actually works!

[nightsurge]

@Siggs2000 did you make a typo in your code examples? You reference @integration in the view, but in your controller it is @integration_project.

Also, in your initial post I think there is an extra end or a missing end somewhere. I see the api_available_projects method end, but then another orphaned render partial: 'api_available_projects' line.

Can you share the actual rendered html you are seeing? Does it not have any form tag at all? No Select tag? No Repo Name? Just a submit, but it does nothing?

[Siggs2000]

I sure did @nightsurge. I tried to simplify the code for the question and messed that up a bit...
I've edited the code in the question to fix that issue.

The form works just fine when I load the partial alone in the browser at
api_available_projects?member_role_id=1

[Siggs2000]

It looks like I've solved this issue. I'm using Materialize CSS and I had to reinitialize the form in the partial that I'm loading via render_asyc. The main init for the materialize js elements are in my application.js file and so I'm not totally sure why they aren't working in the partial but sure enough... If I add the initializer commands inside of <script> tags in the partial view file, it works. Weird, but I don't think it's the fault of this gem. Materialize is a bit buggy still.

[nikolalsvk]

Great to hear that you've managed to solve the issue. The reason why Materialize didn't "work" on your code in the partial is because it didn't run after the partial was loaded. In other words, the partial with the form loaded, but it didn't go through Materialize. Again, this is just a guess from my side.

If you're OK with it, I'd close this issue since you got it resolved. If you want, you could create a PR to README with your use case with that library you're using with code and an example. It may help someone in the future :)