网站首页
开启辅助访问

FineUI 官方论坛

 找回密码
 立即注册

QQ登录

只需一步，快速开始

本论坛已关闭（禁止注册、发帖和回复）
请移步 三石和他的朋友们

FineUI首页 WebForms - MVC & Core - JavaScript 常见问题 - QQ群 - 十周年征文活动

FineUI（开源版） 下载源代码 - 下载空项目 - 获取ExtJS - 文档 在线示例 - 版本更新 - 捐赠作者 - 教程

升级到 ASP.NET Core 3.1，快、快、快！ 全新ASP.NET Core，比WebForms还简单！ 欢迎加入【三石和他的朋友们】（基础版下载）

搜索
FineUI 官方论坛»论坛首页 › FineUI（WebForms，开源版） › FineUI 交流讨论区 › 布局请教
返回列表 发新帖
查看: 4977|回复: 7
打印 上一主题 下一主题

布局请教

[复制链接]
/可爱WEBMAN
跳转到指定楼层
楼主
发表于 2012-4-12 11:15:39 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
这样一个布局，如何让下面的Grid高度100%

本帖子中包含更多资源

您需要 登录 才可以下载或查看，没有帐号？立即注册

x
回复

举报

sanshi
沙发
发表于 2012-4-12 12:36:03 来自手机 | 只看该作者
仔细看下vBox布局
回复 支持 反对

举报

Landroid
板凳
发表于 2012-4-12 13:08:35 | 只看该作者
本帖最后由 Landroid 于 2012-4-12 13:30 编辑
  1.     <script type="text/javascript">
  2.         function onReady() {
  3.             var form2 = Ext.getCmp('<%=Form2.ClientID%>');
  4.             var grid1 = Ext.getCmp('<%=Grid1.ClientID%>');
  5.             var bodySize = Ext.getBody().getSize();
  6.             var form2Size = form2.getSize();
  7.             grid1.setHeight(bodySize.height - form2Size.height);
  8.         }
  9.     </script>
复制代码
解释：我测试的用例中，页面中元素结构如下
<body>
...
<ext:Form id="form2"></Form >
<ext:Grid id="grid1"></Grid >
</body>

var bodySize = Ext.getBody().getSize(); //是获取页面body的高度和宽度
var form2Size = form2.getSize();//是获取grid上的form的高度和宽度
grid1.setHeight(bodySize.height - form2Size.height); //设置grid高度，为：body高度 - form2高度


注意，加入给grid设置了AutoHeight="true"，请修改为false


我总结了一下，详细的在这http://bbs.extasp.net/forum.php?mod=viewthread&tid=440&page=1&extra=#pid1752
回复 支持 反对

举报

/可爱WEBMAN
地板
 楼主| 发表于 2012-4-13 17:18:39 | 只看该作者
sanshi 发表于 2012-4-12 12:36
仔细看下vBox布局

vBOx 上面的就没有了，只有下面的grid了
回复 支持 反对

举报

/可爱WEBMAN
5#
 楼主| 发表于 2012-4-13 17:20:19 | 只看该作者
    <form id="form1" runat="server">
    <extageManager ID="ageManager1" runat="server" />
    <extanel ID="anel1" runat="server" BodyPadding="5px" EnableBackgroundColor="true"
        ShowBorder="true" ShowHeader="false" Layout="VBox" Title="anel" EnableFrame="True">
        <Toolbars>
            <ext:Toolbar ID="Toolbar1" runat="server">
                <Items>
                    <ext:Button ID="Button_search" Text="查询" CssStyle="padding-right:5px" EnablePostBack="false"
                        Icon="ZoomIn" runat="server">
                    </ext:Button>
                    <ext:Button ID="Button_add" Text="增加" CssStyle="padding-right:5px" EnablePostBack="true"
                        runat="server" Icon="UserAdd">
                    </ext:Button>
                    <ext:Button ID="Button_modifi" Icon="UserEdit" Text="修改" CssStyle="padding-right:5px"
                        EnablePostBack="true" runat="server" >
                    </ext:Button>
                    <ext:Button ID="Button_del" Icon="UserDelete" Text="删除" CssStyle="padding-right:5px"
                        EnablePostBack="true" runat="server">
                    </ext:Button>
                    <ext:Button ID="Button_save" Icon="ageSave" Text="保存" CssStyle="padding-right:5px"
                        runat="server">
                    </ext:Button>
                    <ext:Button ID="Button_ref" Icon="ageRefresh" Text="刷新" CssStyle="padding-right:5px"
                        EnablePostBack="false" runat="server">
                    </ext:Button>
                    <ext:Button ID="Button_lock" Icon="Lock" Text="锁定" CssStyle="padding-right:5px" EnablePostBack="false"
                        runat="server">
                    </ext:Button>
                </Items>
            </ext:Toolbar>
        </Toolbars>
        <Items>
            <ext:GroupPanel runat="server" AutoHeight="true" BoxFlex="1" Title="用户信息" ID="GroupPanel1"
                EnableCollapse="true" EnableFrame="True">
                <Items>
                    <ext:Form ID="Form2" runat="server" ShowHeader="false" BodyStyle="border:0px" EnableBackgroundColor="true"
                        LabelAlign="Right" EnableFrame="True">
                        <Rows>
                            <ext:FormRow ID="FormRow1" runat="server">
                                <Items>
                                    <ext:TextBox ID="textusercode" ShowRedStar="true" runat="server" Label="用户编码">
                                    </ext:TextBox>
                                    <ext:TextBox ID="textusername" ShowRedStar="true" runat="server" Label="用户名">
                                    </ext:TextBox>
                                    <ext:TextBox ID="texttruename" ShowRedStar="true" runat="server" Label="真实姓名">
                                    </ext:TextBox>
                                </Items>
                            </ext:FormRow>
                            <ext:FormRow ID="FormRow2" runat="server" ColumnWidths="400">
                                <Items>
                                    <ext:TextBox ID="Text_identified" ShowRedStar="true" runat="server" Label="证件号">
                                    </ext:TextBox>
                                    <ext:TextBox ID="text_password" ShowRedStar="true" TextMode="assword" runat="server"
                                        Label="密码">
                                    </ext:TextBox>
                                    <extropDownList ID="DropDownList_sex" runat="server" ShowRedStar="true" Label="性别">
                                        <extistItem Value="1" Text="男" />
                                        <extistItem Value="0" Text="女" />
                                    </extropDownList>
                                </Items>
                            </ext:FormRow>
                            <ext:FormRow ID="FormRow3" runat="server">
                                <Items>
                                    <ext:TwinTriggerBox ID="ttb_office" Trigger1Icon="Clear" ShowTrigger1="False" EmptyText="点击选择查询"
                                        Trigger2Icon="Search" ShowRedStar="true" runat="server" Label="职位" >
                                    </ext:TwinTriggerBox>
                                    <ext:TwinTriggerBox ID="ttb_dempt" Trigger1Icon="Clear" ShowTrigger1="False" EmptyText="点击选择查询"
                                        Trigger2Icon="Search" ShowRedStar="true" runat="server" Label="部门">
                                    </ext:TwinTriggerBox>
                                    <extropDownList ID="DropDownList_lock" runat="server" ShowRedStar="true" Label="是否锁定">
                                        <extistItem Value="Y" Text="是" />
                                        <extistItem Value="N" Text="否" />
                                    </extropDownList>
                                </Items>
                            </ext:FormRow>
                            <ext:FormRow ID="FormRow4" runat="server" HideMode="Display" ViewStateMode="Disabled">
                                <Items>
                                    <ext:TextBox ID="text_memo" runat="server" Label="备注">
                                    </ext:TextBox>
                                    <ext:HiddenField ID="HiddenField_pk_user" Label="pk_user" runat="server">
                                    </ext:HiddenField>
                                    <ext:HiddenField  ID="HiddenField_office" Label="office" runat="server">
                                    </ext:HiddenField>
                                </Items>
                            </ext:FormRow>
                        </Rows>
                    </ext:Form>
                </Items>
            </ext:GroupPanel>
        </Items>
    </extanel>
    <ext:Grid runat="server" IsDatabasePaging="True" AllowSorting="True" EnableCheckBoxSelect="True"
        Title="人员档案列表" BoxConfigAlign="Middle" BoxMargin="0" ID="Grid1"
        EnableRowClick="True" EnableRowDoubleClick="false"
       >
        <columns>
                        
                        <ext:TemplateField ColumnID="ct0" HeaderText="序号">
                            <ItemTemplate>
                                <%# Container.DataItemIndex + 1 %>
                            </ItemTemplate>
                        </ext:TemplateField>
                        <ext:TemplateField ColumnID="ct1" HeaderText="用户编码">
                            <ItemTemplate>
                                <%# ((AirPlan.Model.user)Container.DataItem).usercode %>
                            </ItemTemplate>
                        </ext:TemplateField>
                        <ext:TemplateField ColumnID="ct2" HeaderText="真实姓名">
                            <ItemTemplate>
                                <%# ((AirPlan.Model.user)Container.DataItem).truename %>
                            </ItemTemplate>
                        </ext:TemplateField>
                        <ext:TemplateField ColumnID="ct3" HeaderText="性别">
                            <ItemTemplate>
                                <%# ((AirPlan.Model.user)Container.DataItem).Sex=="1"?"男":"女" %>
                            </ItemTemplate>
                        </ext:TemplateField>
                        <ext:TemplateField ColumnID="ct4" HeaderText="用户名">
                            <ItemTemplate>
                                <%# ((AirPlan.Model.user)Container.DataItem).username %>
                            </ItemTemplate>
                        </ext:TemplateField>
                        <ext:TemplateField ColumnID="ct5" HeaderText="证件号">
                            <ItemTemplate>
                                <%# ((AirPlan.Model.user)Container.DataItem).identifiedcode %>
                            </ItemTemplate>
                        </ext:TemplateField>
                        <ext:TemplateField ColumnID="ct6" HeaderText="是否锁定">
                            <ItemTemplate>
                                <%# ((AirPlan.Model.user)Container.DataItem).locked=="N"?"否":"是" %>
                            </ItemTemplate>
                        </ext:TemplateField>
                        <ext:TemplateField ColumnID="ct7" HeaderText="创建人">
                            <ItemTemplate>
                                <%# ((AirPlan.Model.user)Container.DataItem).createdby %>
                            </ItemTemplate>
                        </ext:TemplateField>
                        <ext:TemplateField ColumnID="ct8" HeaderText="创建时间">
                            <ItemTemplate>
                                <%# ((AirPlan.Model.user)Container.DataItem).createdon %>
                            </ItemTemplate>
                        </ext:TemplateField>
                        <ext:TemplateField ColumnID="ct9" hidden="true"  HeaderText="pk_user">
                            <ItemTemplate>
                            <aspabel ID="Label2" hidden="true" runat="server" Text='<%# ((AirPlan.Model.user)Container.DataItem).pk_user %>'></aspabel>
                            </ItemTemplate>
                        </ext:TemplateField>
                    </columns>
    </ext:Grid>
    </form>
回复 支持 反对

举报

Landroid
6#
发表于 2012-4-13 17:23:54 | 只看该作者
/可爱WEBMAN 发表于 2012-4-13 17:18
vBOx 上面的就没有了，只有下面的grid了

VBox内的panel要设置高度
回复 支持 反对

举报

/可爱WEBMAN
7#
 楼主| 发表于 2012-4-13 17:47:26 | 只看该作者
Landroid 发表于 2012-4-13 17:23
VBox内的panel要设置高度

这个高度没法设啊，就是要求为hight=100%
回复 支持 反对

举报

Landroid
8#
发表于 2012-4-13 18:11:03 | 只看该作者
/可爱WEBMAN 发表于 2012-4-13 17:47
这个高度没法设啊，就是要求为hight=100%

没看到你设置高度的地方哦，
建议你研究一下vBox布局 http://extasp.net/#/layout/vbox.aspx
或者js设置高度吧~~
回复 支持 反对

举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|FineUI 官方论坛 ( 皖ICP备2021006167号-1 )

GMT+8, 2024-11-1 10:21 , Processed in 0.049422 second(s), 18 queries , Gzip On.

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表