JSFiddle - React, Tailwind, and code Playground

by lforms

HTML

<html>
  <head><link rel=stylesheet href="https://clin-table-search.lhc.nlm.nih.gov/autocomplete-lhc-versions/15.1.1/autocomplete-lhc.min.css"></head>
  <body>
    <p><input type=text id="unit" placeholder="Unit"></p>
    <p><input type=text id="property" placeholder="Property"></p>
    <script src="https://clin-table-search.lhc.nlm.nih.gov/autocomplete-lhc-versions/15.1.1/autocomplete-lhc_jQuery.min.js"></script>
  </body>
</html>

JavaScript

var autocomp = new Def.Autocompleter.Search(
  'unit',
  'https://clin-table-search.lhc.nlm.nih.gov/api/ucum/v3/search?df=cs_code,name&ef=loinc_property',
  {tableFormat: true, colHeaders: ['Code', 'Name']
  });

  
Def.Autocompleter.Event.observeListSelections('unit', function() {
  var itemData = autocomp.getSelectedItemData()[0].data;
  var field = $('#property')[0];
  field.value = itemData['loinc_property'];
});