#javascript #jquery #ajax #ruby-on-rails-4
#javascript #jquery #ajax #ruby-on-rails-4
Вопрос:
Часть js работает, только повторный рендеринг не происходит, если я не нажму обновить в браузере, поэтому данные отправляются и создаются в БД, но js не отображает новые данные.
Мой JS:
$('#myform').submit(function() {
var valuesToSubmit = $(this).serialize();
$(this).find('textarea').addClass('uneditable-input').attr('disabled', 'disabled');
$.ajax({
url: $(this).attr('action'), //sumbits it to the given url of the form
data: valuesToSubmit,
type: "POST",
dataType: "JSON" // you want a difference between normal and ajax-calls, and json is standard
}).complete(function(json){
//act on result.
//alert("submitted");
$("#disabletext").removeClass('uneditable-input').removeAttr('disabled', 'disabled').val('');
#this line below is the only thing that doesn't work
$('#indexstream').html("<%= escape_javascript (render 'postline') %>");
#this line works, but it hides the most recent post in the index and shows it again
#but the most recent post should be the one after this form submits
$("#userlink").hide().show("slow").effect('highlight', {}, 3000);
});
return false; // prevents normal behaviour
});
});
Вид:
<div id="indexstream">
<%= render 'postline' %>
</div>
_postline.html.erb
<% @posts.each do |post| %>
<div id="streamline">
<div id ="userlink">
<%= image_tag post.avatar.url(:small), :style => "border-radius: 5px; border: 1px solid #e1e8ed;" %>
<%= post.firstname %> <%= " " %> <%= post.lastname %><%= " " %> <%= link_to post.email, user_path(post.user_id), {class: "usernamelink", style: "font-weight: normal;"} %>
<abbr class="timeago" title="<%= post.created_at.getutc.iso8601 %>" style="float: right; margin-right: 5px; font-size:90%;
margin-top: 12px; color: #8899a6; text-decoration: none !important;">
<%= post.created_at.to_s %>
</abbr>
<br /><br />
<% unless post.description == "status" %>
<div style="background: #EF4836; width: 10px; height: 5px; float: right; margin-top: -58px; text-align: center; border-radius: 10px; color: #fff; padding-top: 2px; padding-bottom: 2px; margin-right: 5px;">
</div>
<h1 style="style= z-index: 100000; color: #3399FF "><%= link_to post.title, post_path(post), {class: "usernamelink", style: "color: #3399FF;"} %></h1>
<% if post.asset1.file? %>
<%= image_tag post.asset1.url(:small) %><% end %> <% if post.asset2.file? %><%= image_tag post.asset2.url(:small) %><% end %> <% if post.asset3.file? %><%= image_tag post.asset3.url(:small) %><% end %> <% if post.asset4.file? %><%= image_tag post.asset4.url(:small) %>
<% end %>
<br /><br />
<i class="fa fa-map-marker fa-lg" style="margin-right: 5px; margin-left: 5px;"></i> <%= post.school %> <div style="float: right; text-align: left; margin-right: 20px;"> <i class="fa fa-usd "></i><%= post.price %></div>
<% end %>
<% if post.description == "status" %>
<div style="background: #2ECC71; width: 10px; height: 5px; float: right; margin-top: -58px; text-align: center; border-radius: 10px; color: #fff; padding-top: 2px; padding-bottom: 2px; margin-right: 5px;">
</div>
<h1><%= auto_link( post.title ) %></h1>
<% if post.asset1.file? %>
<%= image_tag post.asset1.url(:small) %><% end %> <% if post.asset2.file? %><%= image_tag post.asset2.url(:small) %><% end %> <% if post.asset3.file? %><%= image_tag post.asset3.url(:small) %><% end %> <% if post.asset4.file? %><%= image_tag post.asset4.url(:small) %>
<% end %>
<br /><br />
<% end %>
</div>
</div>
<% end %>
posts controller создает метод:
def create
@post = Post.new(post_params)
@post.email = current_user.username
@post.user_id = current_user.id
@post.firstname = current_user.firstname
@post.lastname = current_user.lastname
@post.avatar = current_user.avatar
@post.school = current_user.school
respond_to do |format|
if @post.save
format.html { redirect_to posts_path, :notice => '<i class="fa fa-check fa-5x"></i>'.html_safe }
# format.js # @current_item = @post
format.json { render action: 'index', status: :created, location: @post }
#format.html {render 'postline'}
else
format.html { render action: 'new' }
format.json { render json: @post.errors, status: :unprocessable_entity }
end
end
end
Код выглядит хорошо для меня, кажется, я вообще не могу заставить его работать. Вы все мне нужны, работали над этим несколько дней без каких-либо результатов
Комментарии:
1. В вашем ajax, где находится
success:
элемент? из-за этого вы можете заменить содержимое html на свой ajax o / p.2. о, так .html не будет работать в ajax complete?
3. изменено
complete
наsuccess
без изменений4. итак, в ajax у нас есть два события
success:
иerror:
. После того, как вы отправили ajax, ответ должен снова прийти на нашу HTML-страницу, верно? .. так, например, мы можем упомянуть,sucess:
что (из ajax) замените этот конкретный <div> на нашей html-странице на ajax-ответ. Если ошибка, то примерalert('something went wrong')
5. можете ли вы попытаться ответить в коде, чтобы я понял, что вы имеете в виду?