选中多个上传时,kendo对话框窗口超出界限

时间:2018-04-04 08:14:22

标签: browser kendo-ui

我有一个关于包含上传的剑道对话窗口的问题。 当我上传多个元素时,列表变得越来越长,并且在某些时候变得比我的浏览器窗口更大,并且在屏幕底部超出界限。 然后插入按钮位于浏览器的下限之下,但浏览器不允许我滚动(firefox + chrome)。

如何将窗口限制在浏览器屏幕上并且不超过它?

@(Html.Kendo().Dialog()
    .Name("ImageBrowser")
    .Content( Html.Partial("ImageBrowserContent").ToString())        
    .MinWidth(400)
    .MinHeight(800)
    .MaxHeight(1000)
    .MaxWidth(800)
    .Modal(true)
    .Visible(false)
)

@(Html.Kendo().Upload()
.Name("imageUpload")
.Messages(mess => mess.Select("Upload"))
.Async(a => a
        .Save("Upload", "Image")
        .Remove("RemoveUpload", "Image")
        .AutoUpload(true)
    )
)

1 个答案:

答案 0 :(得分:0)

我已经为你提供了一个道场,希望你能成为什么样的人。 https://dojo.telerik.com/eqaZibIL

它使用javascript版本,但您可以将我创建的函数应用于对话框初始事件。像这样:

  function dialog_resize() {

  //THIS GETS THE POPUP DIALOG 
  var popUpDialog = $('#dialog').data("kendoDialog");

  //THIS GETS THE CONTENT AREA FOR THE ENTIRE DIALOG
  var contentArea = $(".k-widget.k-window.k-dialog");

  //THIS GETS THE ACTUAL CONTENT AREA OF THE DIALOG IE.WHAT YOU WANT DISPLAYED
  var innerForm = $("#dialog");

  var windowHeight = $(window).innerHeight();
  var windowWidth = $(window).innerWidth();
  //CALCULATE THE WIDTH OF THE DIALOG AND SET IT TO 80% 
  //OF SCREEN REALESTATE TO STRECH OUT. 
  //NOT REQUIRED IF YOU ARE SETTING THE WIDTH MANUALLY. 
  contentArea.width(windowWidth * 0.8)


  //CENTER THE DIALOG ON THE SCREEN.  
  popUpDialog.center();

  //GET 97% OF THE AVAILABLE DIALOG CONTENT AREA TO SHOW Y-SCROLL BAR
  var fixedHeight = (contentArea.height() * 0.97);
  var fixedWidth = contentArea.width() * 0.965;


  //SET THE HEIGHT, WIDTH AND SCROLL BAR OF THE CONTENT AREA
  //SHOWING BLUE BORDER TO SHOW THE ITEM IS POSITIONING CORRECTLY IN DIALOG
  innerForm.height(fixedHeight).width(fixedWidth).css({
    maxHeight: fixedHeight + 'px !important',
    maxWidth: fixedWidth + 'px !important',
    overflowY: 'scroll',
    overflowX: 'hidden',
    border: '1px solid blue'

  });
}

(这是我为处理kendoWindow而修改的一些代码,所以我认为可以进行优化)

maxHeight

希望你能跟随这里发生的事情。 只要您在初始化时为对话框设置$ touch 20180401abc.txt 20180402acb.txt 20180402def.txt $ for F in *.txt; do DIR=$(echo $F | sed -r 's/[a-z]{3}.txt$//'); mkdir -p $DIR; mv $F $DIR/$F; done $ find > ./20180402 > ./20180402/20180402acb.txt > ./20180402/20180402def.txt > ./20180401 > ./20180401/20180401abc.txt ,所有这些似乎都能正常工作。我已经在内容区域应用了蓝色边框,仅用于演示目的,因此您可以看到它的实际效果。