JQuery-UI: диалог не открывается в вертикальном центре - PullRequest
Новая
       39

JQuery-UI: диалог не открывается в вертикальном центре

0 голосов
/ 11 июня 2018

У меня есть диалоговое окно jquery ui, которое определяется следующим образом: 

$('#processPosition').dialog({
        autoOpen : false,
        open: function ()
        {           
            dialogProps.originalContent = $("#processPosition").html(),
            dialogProps.type = $(this).data('type');

            $('#' + dialogProps.type).appendTo($(this));
            $('#rejectPosition').appendTo($(this));
            $("#processPosition .template").removeClass("template");
        },
        show : "blind",
        modal : true,
        resizable : false,
        scrollbar : false
    });

Вот как я его открываю: 

$('#processOrderPosition').dialog({width: 800})
                          .dialog('option', 'position', 'center')
                          .dialog("open");

Это единственный CSS класса шаблона:

.template
{
    display: none;
}

HTML-шаблон div s: 

<div id="SAP-flst-Dialog" class="template">
    <h4>Header</h4>
    <div class="row">
        <span>Some text</span>
    </div>
</div>

<div id="rejectOrderPosition" class="template">
    <h4>second Header</h4>
    <span>Some more Text</span>
</div>

Я также пытался установить атрибут позиции после его открытия, но безрезультатно.В инструментах разработки моего браузера я вижу, что jquery генерирует div, и этот div имеет неправильное значение для атрибута css top.div имеет следующие классы: ui-dialog ui-widget ui-widget-content ui-corner-all ui-front ui-draggable

Что вызывает неправильное верхнее значение?

1 Ответ

0 голосов
/ 11 июня 2018

https://jsfiddle.net/c85fo36u/6

$(document).ready(function(){
  $('#processPosition').dialog({
  autoOpen : false,
  open: function ()
  {           
      dialogProps.originalContent = $("#processPosition").html(),
      dialogProps.type = $(this).data('type');
      $('#' + dialogProps.type).appendTo($(this));
      $('#rejectPosition').appendTo($(this));
      $("#processPosition .template").removeClass("template");
  },
  show : "blind",
  modal : true,
  resizable : false,
  scrollbar : false
});

$ ('# processPosition'). Dialog (). Dialog ("open");

})

Посмотрите наНа этой скрипке я добавил границу в div, чтобы увидеть, что она в центре.

...