12

バックグラウンドで、リロードして、未読メッセージの数を表示します。
ページを更新せずにそれが欲しい。私はajaxを使用することを意味します。

これがメニューにある場合、30秒ごとにこのセクションのみを更新するにはどうすればよいですか？

<li><%= link_to sanitize('<i class="icon-envelope"></i> ') + "received messages" + sanitize(' <span class="badge badge-info">'+current_user.mailbox.inbox(:read => false).count(:id, :distinct => true).to_s+'</span>'), messages_received_path  %></li>

messages_controller.rb

  def received
    if params[:search]
     @messages = current_user.mailbox.inbox.search_messages(@search).page(params[:page]).per(10)
    else
     @messages = current_user.mailbox.inbox.page(params[:page]).per(10)
    end 
     add_crumb 'Messages Received', messages_received_path

     @box = 'inbox'
     render :index
  end

更新：_ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _

アセット/javascript/refresh_messages_count.js

$(document).ready(function () {
    // will call refreshPartial every 3 seconds
    setInterval(refreshPartial, 3000)

});

function refreshPartial() {
  $.ajax({
    url: "messages/refresh_part";
 })
}

messages_controller.rb

def refresh_part
    @message_count = current_user.mailbox.inbox(:read => false).count(:id, :distinct => true)

    # get whatever data you need to a variable named @data 
    respond_to do |format| 
        format.js {render :action=>"refresh_part.js"} 
    end

end

views / layouts / _menu.html.erb

<span id="message_received_count"><%= render :partial => "layouts/message_received_count" %></span>

views / layouts / _message_received_count.html.erb

<% if user_signed_in? && current_user.mailbox.inbox(:read => false).count(:id, :distinct => true) > 0 %>
 <li><%= link_to sanitize('<i class="icon-envelope"></i> ') + "Received" + sanitize(' <span class="badge badge-info">'+@message_count.to_s+'</span>'), messages_received_path  %></li>
<% else %>
 <li><%= link_to sanitize('<i class="icon-envelope"></i> ') + "Received", messages_received_path  %></li>
<% end %>

ビュー/メッセージ/refresh_part.js.erb

$('#message_received_count').html("#{escape_javascript(render 'layouts/messages_received_count', data: @message_count)}");
4

3 に答える 3

26

setIntervalを使用してajaxリクエストを送信します。

$(document).ready(function () {
    // will call refreshPartial every 3 seconds
    setInterval(refreshPartial, 3000)

});

// calls action refreshing the partial
function refreshPartial() {
  $.ajax({
    url: "whatever_controller/refresh_part"
 })
}

次に、コントローラーで次のようなアクションを実行します。

def refresh_part
  # get whatever data you need to a variable named @data
  respond_to do |format|
    format.js
  end
end

次に、という名前のjsファイルを作成しますrefresh_part.js.haml（hamlの代わりにerbを使用できます）。

refresh_part.js.hamlは次のようになります。

$('#part_you_want_to_refresh').html("#{escape_javascript(render 'name_of_partial', data: @data)}");

で正しいルートを設定していることを確認してくださいroutes.rb。

于 2012-12-21T11:10:49.203 に答える
3

参考までに、refresh_part.js.erbは次のようになります。

$("#part").html("<%= escape_javascript(render 'partial', data: @data) %>");

それ以外の：

$('#part').html("#{escape_javascript(render 'partial', data: @data)}");

また、「escape_javascript」のエイリアスを使用してこれを簡略化することもできます。

$("#part").html("<%= j(render 'partial', data: @data) %>");
于 2017-06-09T09:02:41.653 に答える
0

はい、できます

<html>
<head>
<script type="text/JavaScript">
<!--
function timedRefresh(timeoutPeriod) {
    setTimeout("location.reload(true);",timeoutPeriod);
}
//   -->
</script>
</head>
<body onload="JavaScript:timedRefresh(5000);">
<p>This page will refresh every 5 seconds. This is because we're using the 'onload' event to call our function. We are passing in the value '5000', which equals 5 seconds.</p>
<p>But hey, try not to annoy your users too much with unnecessary page refreshes every few seconds!</p>
</body>
</html>

ソース：http ：//www.quackit.com/javascript/javascript_refresh_page.cfm

于 2012-12-21T10:43:51.740 に答える