Form Sample : Search Screen

image Zul File
   1: <?page title="Patient List" contentType="text/html;charset=UTF-8"?>
   2: <zk>
   3:     <style src="/Patient1.css" />
   4:     <window id="PatientList" title="Patient List" width="100%"
   5:         height="auto" border="normal" sclass="listingwindow">
   6:         <separator />
   7:         <panel width="100%">
   8:             <panelchildren>
   9:                 <grid sclass="fgrid">
  10:                     <columns>
  11:                         <column hflex="min"   />
  12:                         <column hflex="min" />
  13:                         <column hflex="min"   />
  14:                         <column hflex="min" />
  15:                         <column hflex="min"  />
  16:                         <column hflex="min" />
  17:                         <column hflex="min"   />
  18:                         <column hflex="min" />
  19:                         <column hflex="min"   />
  20:                         <column hflex="min" />
  21:                     </columns>
  22:                     <rows>
  23:                         <row>
  24:                             <label value="Patient Code" />
  25:                             <hbox>
  26:                                 <textbox id="patCode" name="patCode"  />
  27:                                 <button label="?" />
  28:                             </hbox>
  29:                             <label value="Last Name" />
  30:                             <textbox id="txtLastName"
  31:                                 name="txtLastName" />
  32:                             <label value="First Name" />
  33:                             <textbox id="txtFirstName"
  34:                                 name="txtFirstName" />
  35:                             <label value="SSN" />
  36:                             <textbox id="txtSSN" name="txtSSN" />
  37:                             <label value="MR Number" />
  38:                             <textbox id="txtmedRec1" name="txtmedRec" />
  39:                         </row>
  40:                         <row>
  41:                             <label value="DOB" />
  42:                             <datebox id="txtdob" name="txtdob" cols="22" />
  43:                             <label value="Home Phone" />
  44:                             <textbox id="txthphone" name="txthphone" />
  45:                             <label value="Mobile Phone" />
  46:                             <textbox id="txtmphone" name="txtmphone" />
  47:                             <label value="Email" />
  48:                             <textbox id="txtemail" name="txtemail" />
  49:                             <label />
  50:                             <checkbox id="activechk"
  51:                                 label="Show only active" />
  52:                         </row>
  53:                         <row>
  54:                             
  55:                             <button label="Search" />
  56:                         </row>
  57:                     </rows>
  58:                 </grid>
  59:             </panelchildren>
  60:         </panel>
  61:         <separator />
  62:     </window>
  63: </zk>

CSS File


   1: .fgrid tr.z-row
   2:         td.z-row-inner,tr.z-row,div.z-grid-body div.z-cell,div.z-grid {
   3:     border: none;
   4:     overflow: hidden;
   5:     zoom: 1;
   6:     background: white;
   7:     border-top: none;
   8:     border-left: none;
   9:     border-right: none;
  10:     border-bottom: none;
  11: }