Javascript 要在浏览器窗口最小化或最大化时重置RadGrid高度吗_Javascript_Asp.net_C# 4.0_Telerik

Javascript 要在浏览器窗口最小化或最大化时重置RadGrid高度吗

javascript asp.net c#-4.0 telerik

Javascript 要在浏览器窗口最小化或最大化时重置RadGrid高度吗,javascript,asp.net,c#-4.0,telerik,Javascript,Asp.net,C# 4.0,Telerik,我有一个RadGrid。我在ClientSettings的ClientEvents中看到过类似于OnGridCreated，OnRowHiding等事件。我想要一个类似于OnBrowserWindowResize的方法，这样当用户最小化或最大化浏览器窗口时，就会引发一个事件，我可以将我的RadGrid高度设置为某个值。我试着用 $(window).resize(function(){..} 但是在这里，我找不到我的RadGrid。请给我一个解决方案首先，您已将GridView放入某个分区。将

我有一个

RadGrid

。我在ClientSettings的ClientEvents中看到过类似于

OnGridCreated

，

OnRowHiding

等事件。我想要一个类似于OnBrowserWindowResize的方法，这样当用户最小化或最大化浏览器窗口时，就会引发一个事件，我可以将我的RadGrid高度设置为某个值。我试着用

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

但是在这里，我找不到我的

RadGrid

。请给我一个解决方案

首先，您已将

GridView

放入某个分区。将属性高度设置为

100%！重要的

。在JS函数中动态编辑div height，试着按照这个示例进行操作

Edit.css

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


/*设定高度100%！重要的*/
.grid_样式{
身高：100%！重要；
宽度：100%！重要；
}

Edit.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>


函数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（窗内高度）
functionReturn=window.innerHeight-18；
functionReturn=parseInt（functionReturn）；
if（（isNaN（functionReturn）==true）| |（functionReturn<0））
functionReturn=0；
返回函数返回；
};
window.onresize=函数（事件）{
var gridC=document.getElementById（“网格内容”）；
if（gridC！=null）{
//此处设置了收割台的px高度
var水头=120；
//这里设置的是你的食物的px高度
高度=80；
//这是窗户高度
var winHeight=getWindowHeight（）；
//此处将动态设置为“上下文高度”
document.getElementById（'grid\u contenner'））
.setAttribute（“样式”、“高度：”+（winHeight-headerHeight-footerHeight）+“px”）；
}
};