How to update with AJAX a list after the action of a remote form?

Question

I have a problem I’ve never had in Java but I’m almost going crazy in Rails. I’m developing a project where there are users and groups. So I created a separate model for relationship N:N between users and groups.

In the group show page I created the group description, below appears the partial form _groupsuser to allow the group creator to add users to that group. Below all this I rendered the partial to display the list of users belonging to the group.

The project has a slightly different structure because I am using partials to avoid replicating the same logic in the control and view so I would like to avoid messing around with the structure and focus only on updating the listing once I have the answer 'ajax:complete'. In case I created in the control the create method:

def create
    if group.user == current_user       
        @groupsuser = Groupsuser.new(groupsuser_params)
        @groupsuser.group = group
        if @groupsuser.save
            flash[:notice] = 'User was successfully add.'
        else
            flash[:alert] = 'User cannot be add.'
        end
    else
        flash[:notice] = "You didn't have permition."
    end
    head :ok
end

I would like to update using only ajax similar to java update method with type facelets:

    <p:commandButton value="All" id="btnAll" process="@all" update="grid"   
                actionListener="#{personBean.savePerson}"/>

For example:

$('create_button').onClick('ajax:complete', render(@group));

to refresh the full page or

$('create_button').onClick('ajax:complete', "Comando mágico para atualizar apenas a div");

Answer 1

First of all, study at Gem Cancan to implement permissions.

With Cancan, the code of your method would look like this:

def create
    @groupsuser = Groupsuser.new(groupsuser_params)
    @groupsuser.group = group
    if @groupsuser.save
        flash[:notice] = 'User was successfully add.'
    else
        flash[:alert] = 'User cannot be add.'
    end
end

Now to register user by Ajax, first add the option remote: true to your registration form. With this, you do not need to add JS code to the POST form with Ajax.

Then add the code at the end of the create action. This code indicates that the request will be of the type javascript.

respond_to do |format|
    format.js
end

Finally, create the create.js.erb view, which contains the JS code that should be executed in the request response. It must be something like:

$('div#users-container').html('<%= j render(@group.users) %>');

With this code, you don’t need to add JS Switch "in hand". The option remote: true is available from the library jquery_ujs.