想要在瀏覽器窗口最小化或最大化時重置RadGrid高度

我有一個RadGrid。我在ClientSettings的ClientEvents中看到類似OnGridCreated,OnRowHiding等事件。我想要一個類似於OnBrowserWindowResize的方法，這樣當用戶最小化或最大化瀏覽器窗口時，會引發一個事件，並且可以將我的RadGrid高度設置爲某個值。我試着用想要在瀏覽器窗口最小化或最大化時重置RadGrid高度

$(window).resize(function(){..}

但在這裏裏面，我無法找到我的RadGrid。請給我一個解決方案

來源

2016-11-15 swifty

首先你已經把你的GridView放入某個div。將屬性高度設置爲100% !importantant。關於JS函數動態編輯div高度，請嘗試遵循此示例爲我工作。

編輯的.css

<style> 
    /*Set height 100% !important*/ 
.grid_style { 
    height: 100% !important; 
    width: 100% !important; 
}

編輯的.aspx

<div class="grid_conteiner" id="grid_conteiner" style="height: 500px;"> 
<telerik:RadGrid RenderMode="Lightweight" ID="RadGrid1" runat="server" GridLines="None" CssClass="grid_style"> 


</telerik:RadGrid>

編輯JS headerHeight值您需要更改並設置標題的高度，同樣可以使用footerHeight。

<script type="text/javascript"> 
    function getWindowHeight() { 
     var functionReturn = 0; 

     if ((document.documentElement) && (document.documentElement.clientHeight)) 
      functionReturn = document.documentElement.clientHeight; 
     else if ((document.body) && (document.body.clientHeight)) 
      functionReturn = document.body.clientHeight; 
     else if ((document.body) && (document.body.offsetHeight)) 
      functionReturn = document.body.offsetHeight; 
     else if (window.innerHeight) 
      functionReturn = window.innerHeight - 18; 

     functionReturn = parseInt(functionReturn); 
     if ((isNaN(functionReturn) === true) || (functionReturn < 0)) 
      functionReturn = 0; 

     return functionReturn; 
    }; 


    window.onresize = function(event) { 
     var gridC = document.getElementById("grid_conteiner"); 

     if (gridC != null) { 
      //Here set in px height of header 
      var headerHeight = 120; 
      //Here set in px height of your fooer 
      var footerHeight = 80; 
      //Here is getting window height 
      var winHeight = getWindowHeight(); 
      //Here is set dynamically height to conteiner 
      document.getElementById('grid_conteiner') 
       .setAttribute("style", "height:" + (winHeight - headerHeight - footerHeight) + "px"); 
     } 

    }; 
</script>

來源

2016-11-15 14:26:52

謝謝你很多@mww :) – swifty

我建議你換一個RadSplitter，它支持OnClientResized客戶端事件中的網格：

<div id="mainDiv" style="height: 100%;" > 
       <telerik:RadSplitter RenderMode="Lightweight" ID="MainSplitter" runat="server" Height="100%" Width="100%" 
        Orientation="Horizontal" OnClientResized="ClientResized"> 

<telerik:RadPane ID="Radpane1" runat="server" MinWidth="400" Scrolling="None"> 
        <asp:Panel ID="Panel1" runat="server" Visible="True" Height="100%"> 
        <telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" AllowCustomPaging="True" 
         PageSize="25" Width="100%" Height="100%"....

你可以看到在Telerik的網站的例子：http://demos.telerik.com/aspnet-ajax/controls/examples/integration/gridandsplitterresizing/defaultcs.aspx?product=splitter

來源

2016-11-16 22:10:09 enricoariel

想要在瀏覽器窗口最小化或最大化時重置RadGrid高度

回答

相關問題