I'm trying to sort through my table column by clicking the header without loading the page.
0
What I'm trying to do is when a user clicks on the headers next to sort link, I want it to load without refreshing the whole page. How would I add this onto my code?
helpers
module ListsHelper
def sort_link(column, title = nil)
title ||= column.titleize
direction = column == sort_column && sort_direction == "asc" ? "desc" : "asc"
icon = sort_direction == "asc" ? "fas fa-chevron-up" : "fas fa-chevron-down"
icon = column == sort_column ? icon : ""
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction)
end
end
views
<div class="demo">
<br>
<table class="table is-responsive is-fullwidth">
<h1>Click header to sort</h1>
<thead>
<tr>
<th><%= sort_link 'Name'%></th>
<th><%= sort_link 'Date' %></th>
<th><%= sort_link 'Number' %></th>
<th><%= sort_link 'Description' %></th>
<th colspan="3"></th>
</tr>
</thead>
<% @lists.each do |list| %>
<tbody>
<tr>
<td><%= list.name %></td>
<td><%= list.date %></td>
<td><%= list.number %></td>
<td><%= list.description %></td>
<td><%= link_to 'Show', list %></td>
<td><%= link_to 'Edit', edit_list_path(list) %></td>
<td><%= link_to 'Destroy', list, method: :delete, data: { confirm: 'Are you sure?' } %></td>
</tr>
</tbody>
<% end %>
</table>
</div>
ruby-on-rails ruby ajax
asked Nov 12 at 15:51
Arthur Truong
5116
add a comment |
0
What I'm trying to do is when a user clicks on the headers next to sort link, I want it to load without refreshing the whole page. How would I add this onto my code?
helpers
module ListsHelper
def sort_link(column, title = nil)
title ||= column.titleize
direction = column == sort_column && sort_direction == "asc" ? "desc" : "asc"
icon = sort_direction == "asc" ? "fas fa-chevron-up" : "fas fa-chevron-down"
icon = column == sort_column ? icon : ""
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction)
end
end
views
<div class="demo">
<br>
<table class="table is-responsive is-fullwidth">
<h1>Click header to sort</h1>
<thead>
<tr>
<th><%= sort_link 'Name'%></th>
<th><%= sort_link 'Date' %></th>
<th><%= sort_link 'Number' %></th>
<th><%= sort_link 'Description' %></th>
<th colspan="3"></th>
</tr>
</thead>
<% @lists.each do |list| %>
<tbody>
<tr>
<td><%= list.name %></td>
<td><%= list.date %></td>
<td><%= list.number %></td>
<td><%= list.description %></td>
<td><%= link_to 'Show', list %></td>
<td><%= link_to 'Edit', edit_list_path(list) %></td>
<td><%= link_to 'Destroy', list, method: :delete, data: { confirm: 'Are you sure?' } %></td>
</tr>
</tbody>
<% end %>
</table>
</div>
ruby-on-rails ruby ajax
asked Nov 12 at 15:51
Arthur Truong
5116
Do you want to sort what is currently in the table, or fetch from the database again?
– jdno
Nov 12 at 16:15
Sort whats currently in the table
– Arthur Truong
Nov 12 at 16:17
add a comment |
0
0
0
What I'm trying to do is when a user clicks on the headers next to sort link, I want it to load without refreshing the whole page. How would I add this onto my code?
helpers
module ListsHelper
def sort_link(column, title = nil)
title ||= column.titleize
direction = column == sort_column && sort_direction == "asc" ? "desc" : "asc"
icon = sort_direction == "asc" ? "fas fa-chevron-up" : "fas fa-chevron-down"
icon = column == sort_column ? icon : ""
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction)
end
end
views
<div class="demo">
<br>
<table class="table is-responsive is-fullwidth">
<h1>Click header to sort</h1>
<thead>
<tr>
<th><%= sort_link 'Name'%></th>
<th><%= sort_link 'Date' %></th>
<th><%= sort_link 'Number' %></th>
<th><%= sort_link 'Description' %></th>
<th colspan="3"></th>
</tr>
</thead>
<% @lists.each do |list| %>
<tbody>
<tr>
<td><%= list.name %></td>
<td><%= list.date %></td>
<td><%= list.number %></td>
<td><%= list.description %></td>
<td><%= link_to 'Show', list %></td>
<td><%= link_to 'Edit', edit_list_path(list) %></td>
<td><%= link_to 'Destroy', list, method: :delete, data: { confirm: 'Are you sure?' } %></td>
</tr>
</tbody>
<% end %>
</table>
</div>
ruby-on-rails ruby ajax
asked Nov 12 at 15:51
Arthur Truong
5116
What I'm trying to do is when a user clicks on the headers next to sort link, I want it to load without refreshing the whole page. How would I add this onto my code?
helpers
module ListsHelper
def sort_link(column, title = nil)
title ||= column.titleize
direction = column == sort_column && sort_direction == "asc" ? "desc" : "asc"
icon = sort_direction == "asc" ? "fas fa-chevron-up" : "fas fa-chevron-down"
icon = column == sort_column ? icon : ""
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction)
end
end
views
<div class="demo">
<br>
<table class="table is-responsive is-fullwidth">
<h1>Click header to sort</h1>
<thead>
<tr>
<th><%= sort_link 'Name'%></th>
<th><%= sort_link 'Date' %></th>
<th><%= sort_link 'Number' %></th>
<th><%= sort_link 'Description' %></th>
<th colspan="3"></th>
</tr>
</thead>
<% @lists.each do |list| %>
<tbody>
<tr>
<td><%= list.name %></td>
<td><%= list.date %></td>
<td><%= list.number %></td>
<td><%= list.description %></td>
<td><%= link_to 'Show', list %></td>
<td><%= link_to 'Edit', edit_list_path(list) %></td>
<td><%= link_to 'Destroy', list, method: :delete, data: { confirm: 'Are you sure?' } %></td>
</tr>
</tbody>
<% end %>
</table>
</div>
ruby-on-rails ruby ajax
ruby-on-rails ruby ajax
asked Nov 12 at 15:51
Arthur Truong
5116
asked Nov 12 at 15:51
Arthur Truong
5116
asked Nov 12 at 15:51
Arthur Truong
5116
asked Nov 12 at 15:51
Arthur Truong
5116
asked Nov 12 at 15:51
Arthur Truong
5116
5116
Do you want to sort what is currently in the table, or fetch from the database again?
– jdno
Nov 12 at 16:15
Sort whats currently in the table
– Arthur Truong
Nov 12 at 16:17
add a comment |
Do you want to sort what is currently in the table, or fetch from the database again?
– jdno
Nov 12 at 16:15
Sort whats currently in the table
– Arthur Truong
Nov 12 at 16:17
Do you want to sort what is currently in the table, or fetch from the database again?
– jdno
Nov 12 at 16:15
Do you want to sort what is currently in the table, or fetch from the database again?
– jdno
Nov 12 at 16:15
Sort whats currently in the table
– Arthur Truong
Nov 12 at 16:17
Sort whats currently in the table
– Arthur Truong
Nov 12 at 16:17
add a comment |
1 Answer
1
active
oldest
votes
0
I finally fixed the problem.
The problem was that I had remote: true inside
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction, remote: true)
instead
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction), remote: true
answered Nov 14 at 12:52
Arthur Truong
5116
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53265671%2fim-trying-to-sort-through-my-table-column-by-clicking-the-header-without-loadin%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
I finally fixed the problem.
The problem was that I had remote: true inside
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction, remote: true)
instead
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction), remote: true
answered Nov 14 at 12:52
Arthur Truong
5116
add a comment |
0
I finally fixed the problem.
The problem was that I had remote: true inside
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction, remote: true)
instead
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction), remote: true
answered Nov 14 at 12:52
Arthur Truong
5116
add a comment |
0
0
0
I finally fixed the problem.
The problem was that I had remote: true inside
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction, remote: true)
instead
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction), remote: true
answered Nov 14 at 12:52
Arthur Truong
5116
I finally fixed the problem.
The problem was that I had remote: true inside
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction, remote: true)
instead
link_to "#{title} <i class='#{icon}'></i>".html_safe, params.merge(:sort => column, direction: direction), remote: true
answered Nov 14 at 12:52
Arthur Truong
5116
answered Nov 14 at 12:52
Arthur Truong
5116
answered Nov 14 at 12:52
Arthur Truong
5116
answered Nov 14 at 12:52
Arthur Truong
5116
5116
add a comment |
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53265671%2fim-trying-to-sort-through-my-table-column-by-clicking-the-header-without-loadin%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Do you want to sort what is currently in the table, or fetch from the database again?
– jdno
Nov 12 at 16:15
Sort whats currently in the table
– Arthur Truong
Nov 12 at 16:17