레일 3으로 ajaxy 가입을 구현하려고합니다. jquery-ujs 및 원격 양식을 사용하고 있습니다. $.get
요청으로 가입 양식에 액세스하고 올바르게 표시됩니다. 이 등록 양식은 원격 : 내 application.js에서jquery-ujs ajax 이벤트가 처리되지 않습니다.
form_for @user, :remote => true, :html => {"data-type" => "html"} do |f|
, 양식을 얻기를위한 아약스 요청, 나는 눈에 거슬리지 자바 스크립트에서 아약스 이벤트에 대한 처리기를 바인딩 성공하려고 해요 경우 :
var load_remote_form = function(evt) {
var href = $(this).attr('href');
// load form template
$.get(href, {}, function(data) {
$('body').append(data);
$('form[data-remote]').bind("ajax:beforeSend", function(e) {
console.log("Caught beforeSend!");
});
});
evt.preventDefault();
};
$(document).ready(function() {
$('a#signup').click(load_remote_form);
});
Chrome의 개발 도구는 이벤트 "ajax:beforeSend
"이 바인드되어 있음을 보여 주지만 처리되지 않습니다 (양식을 보내면 자바 스크립트 콘솔에 아무것도 없습니다. 레일 로그에서 요청이 올바르게 처리되었고 응답이 전송됨을 알 수 있습니다.)). click
처럼 다른 이벤트를 동일한 선택 자 (form[data-remote]
)에 바인딩 할 수 있으며 올바르게 처리됩니다.
.live
을 통해 바인딩 된 Ajax 이벤트도 처리되지 않습니다. 그러나 양식을 레이아웃의 일부로 렌더링하면 (예 : http://localhost:3000/signup/과 같은 독립 실행 형 페이지에 있음) 바인딩 된 "ajax:beforeSend
"이 올바르게 처리됩니다.
내 컨트롤러
은 (다만 경우에, 그것은 잘못 기록 될 수 있지만, 나는 그것이 작동 확신) :class UsersController < ApplicationController
layout :layout_for_type
def new
@user = User.new
end
def create
@user = User.new(params[:user])
if @user.save
session[:user_id] = @user.id
flash[:notice] = "You have successfully registered."
redirect_to root_url
else
if request.xhr?
render :action => 'new', :status => :unprocessable_entry, :layout => false
else
render :action => 'new'
end
end
end
def layout_for_type
request.xhr? ? nil : "application"
end
end
내가 잘못을하고있는 중이 야 뭐? 그러한 "이중 ajaxed"양식을 구현하기위한 더 나은 접근법이있을 수 있습니까?