Please enable JavaScript to view this site.

Navigation: Advanced topics > Events > Sample events > Appearance

Show dropdown list of US states

Scroll Prev Next More

 

You can show the dropdown list of US states if US was selected in the Country list; hide it otherwise. Use the following code in JavaScript OnLoad event on Add/Edit pages in popup and inline.

 

 

var ctrlCountry = Runner.getControl(pageid, 'country');
var ctrlState = Runner.getControl(pageid, 'state');
 
ctrlCountry.on('change', function(e){
  if (this.getValue() == 'US'){
     ctrlState.show();
  }else{
     ctrlState.hide();
  }
});

 

You may want to hide the field label as well. Use the following code to hide or show the whole table row with the State edit control based on the Country field selection. This code works in popup and inline Add/Edit modes.

 

var ctrlCountry = Runner.getControl(pageid, 'country');
 
ctrlCountry.on('change', function(e) {
  if (this.getValue() == 'US') {
       pageObj.showField("state");
   } else {
       pageObj.hideField("state");
   }
});

See also:

JavaScript API: Control object > getControl()

JavaScript API: Control object > getValue()

JavaScript API: Control object > on()

JavaScript API: Control object > show()

JavaScript API: Control object > hide()

JavaScript API: RunnerPage object > showField()

JavaScript API: RunnerPage object > hideField()

JavaScript API: RunnerPage object

JavaScript API