2011-01-10 8 views
1

안녕하세요, 저는 현재 ajax 요청을 실행하는 jQuery 라이브러리를 사용하는 레일 애플 리케이션이 있습니다. 레일 프로그램은 다음 드래그 객체를 가지고 올바른 용기에 드롭하도록되어레일 및 jQuery Ajax 요청 보내기

a(this).data("draggable") is undefined 

: 그러나 나는 밖으로 전송되는 나에게 오류를주고있다 아약스 요청으로 약간의 문제로 실행했습니다 끌어서 놓기로 지정된 새 권한을 반영하도록 드래그 가능한 객체의 속성을 업데이트합니다. 그래서 기본적으로 사용 권한을 구성하는 방법이지만 끌어서 놓기를 사용하는 방법입니다. 이것은 레일 코드

<%= drop_receiving_element drop_id, 
      :onDrop => "function(ev,ui){ 
      if (confirm(\"#{escape_javascript(_('This will add User to this Group, are you sure?'))}\")) 
      {#{remote_function(:update => 'module_content', 
      :url => {:controller => :projects, 
      :action => :member_change, 
      :id => @project.id}, 
      :with => "'u=' + encodeURIComponent($(ui.draggable).attr('id')) + '&r=' + encodeURIComponent($(this).attr('id'))" 
     )};} 
      }", 
      :accept => '.RolesUsersSelection', 
      :update => 'roles_edit', 
      :url => {:controller => :projects, :action => :role_user_update}, 
      :hoverclass => "#{drop_class}_active" 
     %> 

입니다 그리고 이것은 jrails 및 JQuery와에 의해 생성 된 자바 스크립트입니다 :

<script type="text/javascript"> 
//<![CDATA[ 
jQuery('#RemoveThisMember').droppable({accept:'.RolesUsersSelection', drop:function(ev,ui){ 
    if (confirm("This will remove User from this Group, are you sure?")) 
    {jQuery.ajax({data:'u=' + encodeURIComponent($(ui.draggable).attr('id')), success:function(request){jQuery('#module_content').html(request);}, type:'post', url:'/of/projects/11/member_delete'});} 
    }, hoverClass:'ProjectRoleDropDelete_active'}) 
//]]> 
</script> 

임 그것은 ($(this).attr('id'))과는하지만이 있어야 다른 확실하지 메신저 뭔가를 가지고 추측하고. .. 고마워,

답변

2

나는 이전 프로젝트에서 동일한 작업을 수행했습니다. 그것은 3 개의 다른 란에있는 뉴스 패널을 끌기를 포함했다.

$(function(){ 
    $(".sortable").sortable({ 
      revert: true, 
      scroll: true, 
      connectWith: '.sortable', 
      placeholder: 'placeholder', 
      forcePlaceholderSize: true, 
      handle: $('h2'), 
      stop: update_user, 
      zIndex: 200, 
      start: start_drag, 
      appendTo: $('.sortable') 
    }); 

}); 

당신은 객체 인 경우 http://docs.jquery.com/UI/Sortable

그래서 자바 스크립트 액션 update_user이 triggerd 될 다른 옵션에 대한 JQuery와 UI API를 확인할 수 있습니다 여기에 내가 끌기에 사용되는 자바 스크립트 (JQuery와) 놓기입니다 떨어진

function update_user(){  

$.ajax({ 
    type: "POST", 
    url: "/<controller>/<action>/", 
    data: "data="+<data>", 
    success: function(msg){ 
    alert("Data Saved: " + msg); 
    } 
    }); 
} 

URL 옵션에서 컨트롤러 및 작업과 처리 할 데이터를 입력해야합니다. 이 예에서는 데이터를 사용하고 ///에서는 다음과 같은 데이터에 액세스 할 수 있습니다.

raise params[:data].inspect 

이 정보가 도움이되기를 바랍니다.

+0

실제로 Javascript 코드를 변경할 수있는 방법이 거의 없기 때문에 레일스 도우미 메서드를 사용하여 자바 스크립트를 만들 수 있습니다. 그러나 어쨌든 당신의 도움에 감사드립니다. – TheRealVayne

+0

방금 ​​ui.draggable.remove() 코드를 추가했습니다. 원격 기능을 수행 한 후 작동했습니다. 도움 주셔서 감사합니다 btw Logged – TheRealVayne

0

어떤 버전의 jQuery (및 jQueryUI)를 사용합니까? 이전 버전의 jQueryUI 1.6.x에는 이와 관련된 버그가있는 것으로 보입니다.

+0

저는 사용하고 있습니다 : jQuery UI 1.7.2 및 jQuery 1.4.4. 그러면 문제가 될 수 없습니다. – TheRealVayne

+0

jQuery UI 1.8.x로 업데이트되었고 여전히 동일한 문제가있는 메신저입니다. – TheRealVayne