Re-render a page using jquery

Question

In react, I could easily re-render a view by passing results from controller. I wish not to use React at this stage and was wondering if it's possible with JQuery?

I have few objects on page, and when clicked, I should see its content. Click the other object, I see its content etc. Sense? I was inspired by this dribbble .

I may not be doing this the right way but this is what I have:

Controller:

def index
  selected_contract = params[:selected_contract] || current_user.contracts.last.id
  @contracts = current_user.contracts.order(created_at: :desc).all
  @selected_contract = current_user.contracts.find_by(id: selected_contract)
end

View:

<% @contracts.each do |contract| %>
  <button class="ui button test" id="<%=contract.id%>"><%=contract.name%></button>
<% end %>

......................................
When clicked, show its content
....................................

<%= @selected_contract.name %>

JS:

$( ".ui.button.test" ).click(function(e) {
  let { id } = this
  console.log(id)
  $.ajax({
    url: `/url/${id}`,
    type: 'POST',
    success: function(result) {
      //$('#listview').redraw()
      console.log('success')
    }
  });
});

Routes are set properly so I get the params in the controller just fine. Is there a re-render a view, just like rerender a prop in React for jquery? Am I doing this the correct way?

Answer 1

If you are using jquery listview this should work.

$( "#listview" ).listview( "refresh" );

Reference https://api.jquerymobile.com/listview/#method-refresh

or since its rails you can reload or render the partial view in your server side as well.