2012-02-16 42 views
0

我试图在可拖动元素中放置uploadify上传视频按钮。uploadify在jquery draggable div中不起作用

我上传的视频部分的视频/ _new_video

<p>Upload your Video </p> 
<div id="video_attachment"></div> 

<%= content_for (:scripts) do%> 
<script type="text/javascript"> 
    $(function() { 
    <% session_key = Rails.application.config.session_options[:key] %> 
    var uploadify_script_data = {}; 
    var csrf_token = $('meta[name=csrf-token]').attr('content'); 
    var csrf_param = $('meta[name=csrf-param]').attr('content'); 

    uploadify_script_data[csrf_param] = encodeURI(encodeURIComponent(csrf_token)); 
    uploadify_script_data['<%= session_key %>'] = '<%= cookies[session_key] %>'; 

    $('#video_attachment').uploadify({ 
     uploader : '<%= asset_path("uploadify/uploadify.swf") %>', 
     script : '<%= videos_path %>', 
     wmode  : 'transparent', 
     cancelImg : '<%= asset_path("uploadify/cancel.png") %>', 
     fileDataName : 'attachment', 
     scriptData : uploadify_script_data, 
     auto  : true, 
     buttonText : 'Browse', 
     onAllComplete : function(event, data){ 
     alert("Success! Please be patient while the video processes."); 
     }, 
     onError: function(event, ID, fileObj, errorObj){ 
     alert("There was an error with the file you tried uploading.\n Please verify that it is the correct type.") 
     } 
    }); 
    }); 
</script> 

的application.js

//= require jquery 
//= require jquery_ujs 
//= require uploadify/jquery.uploadify.v2.1.4.min 
//= require uploadify/swfobject 

profile.js

$(document).ready(function(){ 

/* For edit_draggable */ 
    $("#edit-draggable").draggable(); 

$("#edit-draggable").hide(); 

}); 

我的个人资料/节目,uploadify会在外面工作像这样的可拖动div:

<%= render "videos/new_video"%> 
<div id="edit-draggable" class="ui-widget-content ui-dialog"> 

    <%= render "edit"%> 
</div> 

,但它不会在拖动DIV像这里面的工作:

<div id="edit-draggable" class="ui-widget-content ui-dialog"> 
    <%= render "videos/new_video"%> 
    <%= render "edit"%> 
</div> 

任何人都知道问题是什么?

在此先感谢您的帮助!

回答

0

好的我已经想通了,所以我要回答我自己的问题。

原来,一个没有拖动柄的可拖动div将掩盖div中的点击事件,所以uploadify按钮被拖动块阻塞。

解决方案是添加一个拖动手柄,因此div只能通过单击部分div来拖动。

2

这应该工作:

.draggable({ cursor: "move", cancel: '.uploadify'})