Datalist & Select Element Usage

This demo page shows:

Create a new sub folder named selectElement under the site\pages folder of the installation path.

Form File:

Create a file named selectElement.frmx and copy/paste the code block showed below into the file.

<!DOCTYPE html>
  
 <html>
  
    <head>
       <title>Select Element Demo</title>
    </head>
  
    <body>
    
       <datalist id="provinces"></datalist>
  
       <datalist id="counties"></datalist>
  
       <controlblock control-block-name="cb1">
          <select style="width: 100px" name="province_id"
             datalist-name="provinces">
          </select>
       </controlblock>
       
       <controlblock control-block-name="cb2">
          <select style="width: 100px" name="county_id" datalist-name="counties" 
             lookup-input-block-name="cb1" lookup-input-name="province_id">
          </select>     
       </controlblock>
       
    </body>
 </html>

Code behind File:

Create a file named selectElement.sqlx and copy/paste the code block showed below into the file.

void page.load() {      
         
         rsProvinces =   select province_name as label, province_id as value
                                         from
                                                 provinces
                                         order by
                                           province_name;
         populate_datalist('provinces', rsProvinces);
  
         rsCounties =    select county_name as label, county_id as value, province_id as province_id
                                         from
                                                 counties
                                         order by
                                           county_name;
         populate_datalist('counties', rsCounties);
 }

Controller File:

void connection_not_found(char connectionName) {
         
         if (connectionName == 'default') then
                 bool connStatus;
                 connStatus = create_oracle_connection('default', 'XE', 'htdemo', '1234'); 
         end if;
         
 }

Output:

Last updated