루비 온 레일즈 (Ruby on Rails) UJS

Question

메신저 부분을 내 페이지에 똑바로 렌더링하려고하는데, 사용자가 클릭하여 줄을 올린 플레이어를 추가하면 플레이어가 사용 가능한 플레이어에서 선택한 플레이어로 이동합니다. 문제의 메신저

.widget-box 
    .widget-title 
    %span.icon 
     %i.icon-list-alt 
    %h5 Available Players 
    .widget-content.nopadding 
    %table.table.table-bordered.table-hover 
     %thead 
     %tr 
      %th Player 
      %th Position 
      %th Phone 
      %th 
     %tbody 
     - @users.each do |user| 
      %tr 
      %td= full_name(user) 
      %td 
      %td= user.mobile 
      %td.span1 
       .btn-group 
       %button.btn.dropdown-toggle{"data-toggle" => "dropdown"} 
        %i.icon-pencil 
        Selection 
        %span.caret 
       %ul.dropdown-menu 
        %li{:class=>"nav-header"} User Management 
        %li= link_to "Add to #{full_name(user)} lineup", availabilities_path(:availability => {:team_id => @schedule.team_id, :user_id => user, :schedule_id => @schedule.id, :unique_id => availability_unique_id(user,@schedule) }), :remote => true, :method => :post, :class => 'addRecord' 
        %li= link_to "Put #{full_name(user)} on standby", "#" 

스케줄/

-title("#{current_user.team.name} :: Schedule") 
/Begin Modal Form 
= render 'schedules/modalform' 
= render 'schedules/modaldelete' 
/Begin Notice Alert 
- if notice 
    #notice.alert.alert-success 
    %button.close{"data-dismiss" => "alert"} × 
    %strong Success: 
    = notice 
.row-fluid 
    .span8 
    .alert.alert-info.alert-block 
     %h4.alert-heading= "#{event_display(@schedule.event)} on #{schedule_time @schedule}" 
     %h5.alert-heading= "#{@schedule.location.name} (#{@schedule.location.address})" 
     %p.times= "Arrived at #{arrive_time(@schedule)}, Ends at #{end_time(@schedule)}" 
     - if can? :manage, @schedule 
     -#%h6.alert-heading Total Attending 
     -#.progress 
     -# .bar.bar-success.tip-top{:style => "width: #{accepted_players(@schedule)/number_of_selected_players(@schedule)}%;", "data-original-title" => "14 out of 17 teammates (82%) have ACCEPTED notifications for this event. Click to see who they are."}= accepted_players(@schedule) 
     -# .bar.bar-danger.tip-top{:style => "width: 10%;", "data-original-title" => "14 out of 17 teammates (82%) have ACCEPTED notifications for this event. Click to see who they are."}= declined_players(@schedule) 
     -# .bar.bar-info.tip-top{:style => "width: 55%;", "data-original-title" => "14 out of 17 teammates (82%) have ACCEPTED notifications for this event. Click to see who they are."}= na_players(@schedule) 
     = link_to "<i class='icon-white icon-book'></i> Close Appointments".html_safe, "#", :class => "btn btn-small btn-primary" 
     = link_to "<i class='icon icon-envelope'></i> Email Attendance Report".html_safe, "#", :class => "btn btn-small" 
     = link_to "<i class='icon icon-pencil'></i> Edit this #{event_display(@schedule.event)}".html_safe, "#modalEvent", :class => "btn btn-small", :data => {:toggle => "modal"} 
     = link_to "<i class='icon-white icon-remove'></i> Delete Event".html_safe, "#modalDelete", :class => "btn btn-small btn-danger", :data => {:toggle => "modal"} 
    = render 'schedules/available_players' 
    #dynamicLoadingPanel 
     = render 'schedules/named_players' 
    .span4 
    .widget-box 
     .widget-title 
     %span.icon 
      %i.icon-locations 
     %h5= "Event Location Map" 
     .widget-content.nopadding 
     %table.table.table-bordered 
      %tbody 
      %tr 
       %td 
       %img{:alt => @schedule.location.address, :src => "http://maps.google.com/maps/api/staticmap?size=300x250&maptype=roadmap&sensor=false&markers=color:blue|label:#{@schedule.location.name}|#{@schedule.location.address}"} 
       .clearfix 
       %span.help-block= "#{@schedule.location.name} (#{@schedule.location.address})" 
    .widget-box 
     .widget-title 
     %span.icon 
      %i.icon-availability 
     %h5= "Availability Summary" 
     .widget-content.nopadding 
     %table.table.table-bordered 
      %tbody 
      %tr 
       %td In 
       %td 
       %span.label.label-success= accepted_players(@schedule) 
      %tr 
       %td Out 
       %td 
       %span.label.label-important= declined_players(@schedule) 
      %tr 
       %td N/A 
       %td 
       %span.label= na_players(@schedule)` 

을 보여 JS
이용 가능성/create.js 파일/_available_players.haml.html/UJS

일정을 jQuery로이 일을 갖는. 예 :

`$('#dynamicLoadingPanel').html("<%= escape_javascript(render(:partial => 'schedules/named_players')) %>") 

Answer 1

질문에 대한 NT 코드는 이것이다 :

#dynamicLoadingPanel 
    = render 'schedules/named_players' 

그리고 그 곳 (코드 도시하지 않음), 및 업데이트 # 만들고 이용 가능성에 게시를하고, 무엇을 반환하는 일정/named_players의 새로운 버전입니다 동적으로 삽입을 #dynamicLoadingPanel 내의 페이지로 이동합니다. ,

# _schedules/available_players.html.haml 
#dynamicLoadingPanel 
    AVAILABILTY IS UNKNOWN 

Choose availability: 
#availabilities 
    = link_to 'available', '#', :data => 'available' 
    = link_to 'busy',  '#', :data => 'busy' 

:javascript 
    $(function(){ 
    $('#availabilities a').click(function(){ 
     $('#dynamicLoadingPanel').load(
     "/availabilities", 
     { availability: $(this).attr('data') } 
    ); 
    }); 
    }); 

# availabilities/create.html.haml 
I will be: 
= params[:availability] 

는 이용 가능성 링크 중 하나를 클릭, 그들없이, #은 (추가 매개 변수가이 게시물 수 있도록해야 만들 availabilites에 게시하는 UJS 호출을 작성

여기에 내 걸릴입니다 부하()는 GET을 수행합니다.

가 이용 가능성에 번호가 완료 만들

, 그것은 뷰 (이 자신의 코드에 = render :partial => 'schedules/named_players'를 넣을 수있는 장소입니다)에 어떤 렌더링 create.html.haml을 렌더링합니다.

jquery 메서드 .load() re 귀하의 게시물에서 반환 된 것과 셀렉터의 innerHTML을 배치합니다.