Set column height fixed

asked 2023-01-02 18:58:29 +0800

AnkitIan
101 ● 1

updated 2023-01-02 18:59:00 +0800

Hi below is my code :

<zk>
        <window id="workload" height="100%" width="100%" apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('com.multimasteruniters.brains.workload.web.controllers.zk.WorkloadManagement')">
           <style>
             .myGrid {
               height: 30px !important; 
               text-align:center;
             }
         </style>
            <hbox>
                <hbox align="start">
                    <radiogroup id="comboType" onCheck="@command('showOptions',filterValue=self.selectedItem.value,listModelQueue=workloadQueueCombo.model,listModelUserGroup=workloadUserGroupCombo.model,listModelUser=workloadUserCombo.model)">
                        <radio label="Queue" radiogroup="comboType" value="0" selected="true"/>
                        <radio label="User Group" value="1" radiogroup="comboType"/>
                        <radio label="User" value="2" radiogroup="comboType"/>
                    </radiogroup>
                </hbox>
                <hbox align="center">
                    <combobox id="workloadQueueCombo" model="@load(vm.workloadQueues)" selectedItem="@bind(vm.selectedQueue)" onSelect="@command('showQueueItems')" placeholder="${ b:l('str.workload.queue') }" width="500px" autodrop="true" visible="@load(vm.filterValue eq 0)">
                       <template name="model" var="queue">
                           <comboitem label="@load(queue.name)" />
                        </template>
                    </combobox>
                    <combobox id="workloadUserGroupCombo" model="@load(vm.workloadUserGroups)" selectedItem="@bind(vm.selectedWorkloadUserGroup)" onSelect="@command('showQueueItems')" placeholder="${ b:l('str.workload.user_group') }" width="500px" autodrop="true" visible="@load(vm.filterValue eq 1)">
                       <template name="model" var="userGroup">
                           <comboitem label="@load(userGroup.description)" />
                        </template>
                    </combobox>
                    <combobox id="workloadUserCombo" model="@load(vm.workloadUsers)" selectedItem="@bind(vm.selectedWorkloadUser)" onSelect="@command('showQueueItems')" placeholder="${ b:l('str.workload.user') }" width="500px" autodrop="true" visible="@load(vm.filterValue eq 2)">
                       <template name="model" var="user">
                           <comboitem label="@load(user.name)" />
                        </template>
                    </combobox>
                </hbox>
                <hbox align="end">
                    <div children="@load(vm.userQueuesStatus)">
                        <template name="children">
                            <checkbox width="75px" label="@load(each)" checked="true" onCheck="@command('setStatus',checked=self.checked,status=each)"/>
                        </template>
                    </div>
                </hbox>
            </hbox>
            <separator spacing="10px" />
            <hbox>
                <grid model="@load(vm.workloadQueueItems)" mold="paging" pageSize="15">
                    <columns sclass="myGrid">
                        <column  label="Queue" align="center" visible="@load(vm.filterValue eq 1 || vm.filterValue eq 2)"/>
                        <column  label="${ b:l('str.workload.user_groupname') }" visible="@load(vm.filterValue eq 0 || vm.filterValue eq 2)"/>
                        <column  label="${ b:l('str.workload.username') }" align="center" visible="@load(vm.filterValue eq 0 || vm.filterValue eq 1)"/>
                        <column  label="${ b:l('str.workload.description') }" align="center"/>
                        <column  label="${ b:l('str.workload.status') }" align="center"/>
                        <column  label="${ b:l('str.workload.starttime') }" align="center"/>
                        <column  label="${ b:l('str.workload.totalduration') }" align="center"/>
                    </columns>
                    <template name="model" var="queueItem" >
                        <row>
                            <label value="@load(queueItem.queueName)" visible="@load(vm.filterValue eq 1 || vm.filterValue eq 2)"/>
                            <label value="@load(queueItem.userGroupDescription)" visible="@load(vm.filterValue eq 0 || vm.filterValue eq 2)"/>
                            <label value="@load(queueItem.username)" visible="@load(vm.filterValue eq 0 || vm.filterValue eq 1)"/>
                            <label value="@load(queueItem.description)"/>
                            <label value="@load(queueItem.userQueueStatus)"/>
                            <label value="@load(queueItem.startTime)"/>
                            <label value="@load(queueItem.totalDuration)"/>
                        </row>
                    </template>
                </grid>
            </hbox>
        </window> 
    </zk>

I have 3 radio buttons; on clicking each one of them we get a grid with column headers of different size I want a fixed column height tried using css and other properties but didn't worked out for me. Can anyone help me out please Thanks in advance.