자동 I가 시도하고 레일에 3

Question

---

안녕하세요 사람들

을 다른 collection_select에서 선택한 항목에 따라 text_fields을 채우는이 알아 냈하지만 난 여전히 그것을 할 수 없습니다.

난 레일 3 앱이 있는데, 나는 송장과 지불을하고있다. 지불을위한 양식에서 나는 모든 송장 번호 (postgres 데이터베이스에서 추출한)를 표시하는 collection_select를 가지고 있으며, 내가하려고하는 것은 인보이스를 선택하지 않은 채 다른 사람의 text_fields (공급자, 주소 등)를 자동 채우기를 선택하는 것입니다. 같은 양식으로 페이지를 다시로드합니다. ...

가 나는 아약스, JS, jQuery를 사용해야 알아,하지만 난이 언어 초보자, 그래서 내가 모르는 어디에서 어떻게

는 당신이 날 도울 수 있기를 바랍니다 시작 덕분에

Answer 1

아약스 호출을 컨트롤러에 연결하면 정보가 포함 된 json으로 응답합니다. jquery를 사용하여 여러 필드를 채 웁니다. 당신의 invoice_controller에서

get "invoice/:id/get_json", :controller=>"invoice", :action=>"get_json" 

:

def get_json 
    invoice = Invoice.find(params[:invoice_id]) 
    render :text => invoice.to_json 
end 

청구서 모델에서 (기본 to_json 방법을하면 충분하지 않은 경우) : 당신의 경로에서

에서

def to_json 
    json = "{" 
    json += "id:'#{self.id}'" 
    json += ",date_created:'#{self.date}'" 
    ...  //add other data you want to have here later 
    json += "}" 
end 

당신의 자바 스크립트 파일,

$("#invoice_selecter").change(function(){ //calls this function when the selected value changes 
    $.get("/invoice/"+$(this).val()+"/get_json",function(data, status, xhr){ //does ajax call to the invoice route we set up above 
    data = eval(data); //turn the response text into a javascript object 
    $("#field_1").val(data.date_created); //sets the value of the fields to the data returned 
    ... 
    }); 
}); 

당신은 아마도 몇 가지 문제에 직면하게 될 것입니다. Google 크롬을 사용하지 않는다면 불의 버그를 다운로드하고 설치하는 것이 좋습니다. 그렇다면 개발 도구를 사용하고 있는지 확인하십시오. 나는 당신이 마우스 오른쪽 버튼을 클릭하고 inspect 요소를 치면 그들을 열 수 있다고 믿는다. 이것을 통해, 당신은 Ajax 요청, 그리고 그것이 성공했는지 여부 등을 모니터 할 수 있어야한다.