1

非常にランダムな動作です。モーダルダイアログを呼び出して、内部の一部を表示しています。

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>

私のviews/boots / newでは、コードは次のとおりです。

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

およびviews/boots/_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ですか？そうでなければ、同じ場所に常に表示され続けるので、おそらくそうではないと思います...だから、私が関数を呼び出す方法であるかどうかわかりませんか？

提案は大歓迎です、これはかなり厄介なグリッチです！

4

2 に答える 2

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'});
});
于 2012-04-27T21:47:23.557 に答える
0

含める：jQueryセンター

への変更：

$(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!
于 2012-04-27T17:03:59.793 に答える