2012-01-17 1 views
1

UJS 호출로 페이지 표시를 업데이트하는 데 문제가 있습니다. 선택 상자가 변경되면 div의 값을 업데이트하려고합니다 (모든 곳을 봤지만 아무 소용이 없었 음).Rails3 UJS 업데이트가 표시되지 않습니다.

I 설정과 같이 변경 기능 (내가 HAML을 사용하고 있습니다) :

%script 
    $("#timesheet_worker_id").change(function() { 
    -# This works, so we know we're responding to the change event: 
    -# alert('Fired the change function'); 
    $.ajax({url: "/timesheet_show_worker_name", 
    async: false, 
    data: 'selected=' + this.value, 
    dataType: 'script'}) 
    }); 
    }); 

내 컨트롤러는 다음과 같습니다

내보기 (내가 simple_form을 사용하고 있습니다)이
def show_worker_name 
    calculated = 'Adam Bilbo' 
    render(:update) {|page| 
    ### The following works just fine! 
    #page << "alert('This is a test')" 
    ### This doesn't; DOM is updated but not displayed; test data for now 
    page << "$('#timesheet_worker_name').val('Adam Bilbo')" 
    } 
end 

:

=f.association :worker, :collection => Worker.all(:order => 'worker_number'), :prompt => 'Select a worker', :label_method => :worker_number, :label => "Worker Number", :input_html => {:class => 'startField'} 
%p{:id => :timesheet_worker_name} 

아약스 호출이 완료되면 DOM을 검사하여 그 값이 존재합니다. 즉, 에서 콘솔 :

$('#timesheet_worker_id").val() 

표시 '아담 빌보',하지만 값이 내 페이지에 표시되지 않습니다.

레일 3.0.9와 gem jquery-rails 1.0.9를 실행 중입니다. 내가 간과하고있는 것을 알아내는 데 도움이되는 것이 가장 좋습니다! 감사.

해결 - 아래의 @iWasRobbed에 의한 해결 방법이 작동합니다. 그러나 기본 문제는 '#timesheet_worker_name'을 (를) 업데이트 할 때 text() 대신 val()을 사용했기 때문에 원래의 방식대로 변경되었습니다.

답변

0

하자 구조 조정이 조금 ...

:javascript 
    $('#timesheet_worker_id').change(function() { 
    $.ajax({ 
     url: '/timesheet_show_worker_name', 
     data: { 'selected': $(this).value }, 
     success: function (json) { 
     $('#timesheet_worker_name').text(json.name); 
     }, 
     error: function (response) { 
     alert('Oops, we had an error.'); 
     } 
    }); 
    }); 

그리고 당신의 컨트롤러 액션은 다음과 같습니다

def show_worker_name 
    calculated = 'Adam Bilbo' 
    render :json => { :name => calculated }, :status => :ok 
end 
+0

죄송합니다; 원래 코드와 동일합니다. 페이지에 표시가 없지만 DOM 값이 설정되었습니다. – JESii

+0

죄송합니다.'# timesheet_worker_name'이 (가) ...'val()'을 사용하여 단락'p' 요소를 설정할 수 없습니다. '$ ('# timesheet_worker_name') .text (json.name); 대신에 다음을 사용해야한다. 나는 나의 대답을 업데이트했다. 다시 미안 해요! – iwasrobbed

+0

그건 속임수 였어. @ iWasRobbed 감사합니다! 그리고 그것은 또한 원래의 예제가 val()에서 text()로 동일한 변경으로 작동한다는 것을 의미합니다. 테스트 해 보았습니다. – JESii