Linked text and select fields

Just a quick snippet for my own reference (or yours) to link together text fields and select fields so that changes to one change the other.

Assumes the matched fields have IDs of :

• text field: someFieldID
• select field: someFieldIDSel

Assumes and initial, unselected Select option with a value of “invalid”.

It also prevents the insertion of illegal values into the text box.

// Selector sets text field ***
$('select.matchedSel').change(function () {
  var tVal = this.value;
  var tID = '#'+$(this).attr('id').slice(0,-3);
  if (tVal == 'invalid') {
    $(tID).val('')
  } else { $(tID).val(tVal); }
});
// Text field sets selector ***
$('input.matchedText').change(function () {
  var tVal = this.value.trim();
  var tID = '#'+$(this).attr('id')+'Sel';
  if (tVal == '') {
    $(tID).val('invalid')
  } else if ($(tID).find('option[value='+tVal+']').length) {
    $(tID).val(tVal);
  } else {
    $(this).val(''); $(tID).val('invalid'); procError(paramlist);
  }
});