#javascript #ruby-on-rails #css
#javascript #ruby-on-rails #css
Вопрос:
Как мне сделать так, чтобы эта кнопка исчезла после того, как пользователь отправит голосование?
<p id="button_<%= review.id %>"><%= f.submit "vote" %></p>
Комментарии:
1. Да, после перезагрузки страницы кнопка не будет отображаться. У меня есть вспомогательный метод, который это делает.
2. Убедитесь и проверьте в каждом браузере, будет ли форма продолжать отправляться (и не будет захвачена при вызове AJAX). В противном случае это может не сработать в некоторых браузерах (например, форма может не отправляться), и вы можете обжечься.
3. Используйте событие отправки формы, чтобы отключить кнопку, ее удаление может привести к путанице.
Ответ №1:
Я бы отключил кнопку вместо скрытия; создает менее запутанный интерфейс.
Вы можете сделать это проще всего, просто добавив onclick атрибут:
<p id="button_<%= review.id %>" onclick="this.disabled=true;"><%= f.submit "vote" %></p>
Но если вы хотите скрыть ее, вы можете использовать this.style.display='none'; вместо этого. (Если я помню ванильный JS)
Если вы уже используете jQuery (или собираетесь делать много подобных вещей):
$('#button_<%= review.id %>').click(function() {
$(this).remove(); // or $(this).hide();
}
редактировать: это показывает разницу между решением Dr.Dredel и моим решением
onsubmit версия, чтобы сделать RobG счастливым (вы должны поместить ее в <form> )
<form ... onsubmit="document.getElementById('button_<%= review.id %>').disabled=true;">
Он прав, что это имеет больше смысла onsubmit ; есть и другие способы отправки формы, например, нажатием enter . Предположительно, вы все равно захотите, чтобы кнопка была отключена в таких сценариях (что, если я не ошибаюсь, также помешает вам отправлять дважды через enter)
редактировать: почему да, это так http://jsfiddle.net/mnbayazit/9Snna/2 /
Комментарии:
1. Я считаю, что visiblity=’hidden’ более универсален для браузера… Я никогда не использовал отображение, чтобы скрыть кнопку… но, возможно, это так же справедливо
2. @Dr.Dredel: вы бы не хотели устанавливать видимость = скрытая вообще… это может скрыть элемент визуально, но он все равно будет занимать место в макете. Обычно вы хотите свернуть содержимое вокруг нее, что и делает display=none, и на самом деле оно очень распространено и хорошо поддерживается. Довольно уверен, что это то, что jQuery делает и внутри.
3. 1 для отключения, но, пожалуйста, используйте событие отправки, а не событие щелчка.
4. о, здорово! и теперь я даже не могу удалить свой комментарий! 🙂 Спасибо за разъяснение!
Ответ №2:
Это основано на предположении, что вы хотите, чтобы люди могли повторно посещать исходную страницу и чтобы кнопка голосования не отображалась снова, а не просто скрывала ее после нажатия кнопки голосования. Если вы хотите, чтобы она исчезла и использовала ajax, в других ответах пока объясняется, как это сделать.
В вашем контроллере посмотрите, отправил ли кто-нибудь отзыв на то, что они рассматривают.
#this assumes that you have foreign keys user_id and article_id in your reviews table
# and that @article and @user are the objects you're passing down
@posted_review = Review.find_by_user_id_and_article_id(@article.id, @user.id)
Затем в представлении:
<% if @posted_review.nil? %>
<p id="button_<%= review.id %>"><%= f.submit "vote" %></p>
<% end %>
Я оставляю @posted_review установленным для фактического объекта просмотра, чтобы вы могли получить доступ к его свойствам, если вам нужно, например, вызвать <%= @posted_review.created_at %>
Комментарии:
1. 1 за объяснение рубиновой стороны вещей… несмотря на то, что похоже, что OP это предусмотрел (комментарий под Q)
2. Спасибо. Похоже, он сделал редактирование ninja после прочтения моего поста. Я думал, что становлюсь дряхлым, прочитав ваш комментарий и увидев это выше.