2014-10-06 4 views
0

내보기에 ajax 추가시 RailsCasts # 240을 팔로우하고 있습니다. 필자가 지금 당장 실행하고있는 문제는 기본적으로 테이블 열을 정렬하거나 색인의 다음 페이지로 이동할 때 URL이 계속 변경된다는 것입니다. 레일을 정확히 따라 갔고, 내가 뭘 잘못하고 있는지 확신하지 못했습니다. 누구든지 아이디어가 있습니까?Ajax URL이 여전히 변경 중입니다.

는 application.js

//= require jquery 
//= require jquery_ujs 

$(function() { 
    $("#network th a, #network .pagination a").live("click", function() { 
    $.getScript(this.href); 
    return false; 
    }); 
}); 

index.html.erb

<h1>Network</h1> 

<div class ="network"> 
    <div class="network-body"> 

    <div id="network"><%= render 'network' %></div> 

    </div> 
</div> 

<br> 

index.js.erb

$("#network").html("<%= escape_javascript(render("network")) %>"); 

gemfile

source 'https://rubygems.org' 
ruby '2.1.2' 


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails' 
gem 'rails', '4.1.4' 
# Use sqlite3 as the database for Active Record 
group :development do 
    gem 'sqlite3' 
end 
# Use SCSS for stylesheets 
gem 'sass-rails', '~> 4.0.3' 
gem 'uglifier', '>= 1.3.0' 
gem 'coffee-rails', '~> 4.0.0' 
gem 'jquery-rails', '>= 3.0.4' 
gem 'turbolinks', '>= 1.1.1' 
gem 'jbuilder', '~> 2.0' 
gem 'bcrypt', '~> 3.1.7' 
gem 'devise', '~> 3.3.0' 
gem 'orm_adapter', '~> 0.5.0' 
gem 'warden', '~> 1.2.3' 
gem 'protected_attributes', '~> 1.0.8' 
gem 'simple_form', '~> 3.0.2' 
gem 'will_paginate', '~>3.0.7' 
gem 'bootstrap-will_paginate', '~> 0.0.10' 
gem 'ancestry', '~> 2.1' 
gem 'whenever', require: false 
gem 'geocoder', '~> 1.2' 

group :doc do 
    gem 'sdoc', '~> 0.4.0', require: false 
end 

group :production do 
    gem 'pg', '~> 0.17.1' 
    gem 'rails_12factor', '~> 0.0.2' 
end 
+0

'.live' 사용되지 않는 것을 읽어 렌더링에 대한 추가 정보를 원하시면 저를 참조하십시오. '$ (document) .on ("click", "#network th a, #network .pagination a", function()'을 시도해보십시오. 또한 getScript 함수에 변수를 전달하여 반환 값을 'function (data, textStatus, jqxhr)'. 예를 들어, 일반적으로'$ .ajax'를 사용합니다. – Dudo

+0

잘 모르겠다. 초보자 질문에 대해 미안하지만, $ (함수)를 $ (문서) 또는 $ .ajax로 대체해야한다고 말하고 있습니까? 위에 나와있는 코드를 사용하여 변수가 의미하는 바를 나에게 보여줄 수 있습니까? –

답변

0
$(document).on('click', '#network th a, #network .pagination a', function(){ 
    $.ajax({ 
    'type': 'get', 
    'dataType': 'script', 
    'url': this.href, 
    'data': { 
     // params you want to send to the server 
    } 
    }) 
    .complete(function(return_value){ 
    alert('something!'); 
    // completed 
    }); 
}); 

일반적으로 나는 어떻게 AJAX를 사용 하는가?오고가는 것에 대한 세부적인 제어가 가능하기 때문입니다. 귀하의 경우에는

, 그 index.js.erb 파일을 사용하고 있기 때문에, 우리가 하나 더 잘 할, 수 사용 레일 '눈에 거슬리지 JS 내장

(즉 jquery_ujs 당신이 application.js에서 볼 해당 파일의)

링크에 remote: true을 추가하십시오.

<%= link_to 'something', home_index_path, remote: true %> 

귀하의 렌더링 두 번 '네트워크'(home_index_path 당신이 당신의 경로에 설정이 무엇 인) ... 확실하지 당신은 일을 할 싶어요. 어쨌든 ...이 링크는 (이 경우) 홈 컨트롤러와 인덱스 동작으로 연결됩니다. remote: true은 js로 응답하도록 알려줍니다. 그래서 행동에, 당신이 포맷 블록을 가지고 있습니다

respond_to do |format| 
    format.html { # html response } 
    format.js { # js response # you might need layout: false here if too much is being rendered } 
end 

'응답자'보석을 사용하여도 멋지다 (레일 4.1의 기본 동작 인,하지만 레일 4.2 보석이다). 이를 통해 컨트롤러 상단에서 액션이 응답하는 내용을 정의한 다음 액션에서 respond_with을 정의 할 수 있습니다. 이 작업은 JS에 응답하면 어쨌든, 그것은 당신이 그 js.erb 파일을 찾고있을 것 :

$("#network").html("<%= j render partial: 'home/network' %>"); 

escape_javascript(render())j render에 일손이 될 수 있으며, 부분을 호출하면 당신이 거기에 다른 물건을 던질 수 있습니다, 같은 컬렉션 또는 로케일. 그러면 템플릿이 빌드되고 (밑줄로 시작!) #network 요소로 덤프됩니다. 그것은 페이지를 다시로드하지 않으며 주소 표시 줄을 변경하지 않습니다.

한 번에 너무 많이하지 않았 으면 좋겠어. 레일즈 UJS를 사용하기 시작했고 .ajax를 사용하기 시작했다. 원시 js/커피에 익숙해지면서 .ajax를 사용하기 시작했다. 올바른 방향으로 움직이게하기 위해 약간의 독서가 있습니다.

http://guides.rubyonrails.org/layouts_and_rendering.html

http://edgeguides.rubyonrails.org/working_with_javascript_in_rails.html

이 UJS에 대한 정보를 원하시면

관련 문제