Диалоговое окно jquery ui появляется внизу страницы

Question

довольно случайное поведение, я призываю модальный диалог, чтобы показать частичное внутри.

Я работаю с simple_form + bootstrap и jquery-ui.

кнопка, которая вызывает функцию имеет этот код в представлении:

<p><%= link_to 'New Boots', new_boot_path, :class => 'btn btn-primary pull-right', :remote => true, :id => 'new_boot_link' %></p> 

в моих взглядов/сапоги/новый код заключается в следующем:

<div id="content"> 
<%= render :partial => 'form' %> 
</div> 

и просмотров/ботинки/_form следующие

<%= simple_form_for(@boot, :html => { :class => 'form-vertical' }, :remote => true) do |f| %> 
<fieldset> 
    <%= f.input :number %> 
    <%= f.input :size, :collection => boot_size_options %> 
    <%= f.input :condition, :collection => boot_condition_options %> 
    <%= f.input :brand , :collection => boot_brand_options %> 
</fieldset> 
    <div class="form-actions"> 
    <%= f.button :submit, :class => 'btn btn-primary' %> 
    <%= submit_tag 'Reset', :type => :reset, :class => "btn btn-danger" %> 
    </div> 
<% end %> 

В application.js я следующее:

$(document).ready(function() { 


     $('#new_boot_link').click(function(e) { 
     var url = $(this).attr('href'); 
     $('#modal').dialog({ 
       title: "New Boots",  
       draggable: true, 
       resizable: false, 
       modal: true, 
       width:'auto', 
       open: function() { 
         return $(this).load(url + ' #content');} 
     }); 
     }); 
    }); 

Таким образом, модальная работа так, как должна, но она появляется в нижней части экрана, однако, если я закрою ее и снова нажимаю на кнопку, она отображается прямо посередине, как это должно было быть сделано в первом место.

Это css? Я думаю, может быть, нет, так как в противном случае он будет постоянно появляться в одном месте ... так что я не знаю, так ли это, как я называю эту функцию?

Предложения приветствуются, это довольно раздражающий глюк!

Answer 1

К сожалению о прошлых ошибках. К сожалению, я не могу воспроизвести вашу проблему лично. Я подозреваю, что это поможет, потому что оно преобразует DIV, а также по заполнению и отображению вызова.

$(document).ready(function(){ 
var modal=$('#modal'); 
$('#new_boot_link').click(function(e) { 
    var url = $(this).attr('href'); 
    modal.load(url + ' #content',function(){ 
    modal.dialog("open"); 
    }); 
}); 
modal.dialog({ autoOpen: false, title: "New Boots", draggable: true, 
resizable: false, modal: true, width:'auto'}); 
}); 

Answer 2

включают: jQuery Center

Изменить на:

$(document).ready(function() { 


    $('#new_boot_link').click(function(e) { 
    var url = $(this).attr('href'); 
    $('#modal').dialog({ 
      title: "New Boots",  
      draggable: true, 
      resizable: false, 
      modal: true, 
      width:'auto', 
      open: function() { 
        return $(this).load(url + ' #content');} 
      }); 
    }).center(false); 
}); 

Этот набор ваш диалог на среднем-центре страницы.

Если у вас есть конкретное место, вы хотите показать диалоговую силу:

..}).css({position:"relative"}).css("left",null).css("top",null); 
// Last too remove value of left and top. Trick with {left:null,top:null} does not work!