JSFiddle - React, Tailwind, and code Playground

by zlobul

HTML

<tr>
  <th class="labelCol vfLabelColTextWrap " scope="row"><label for="thePage:form:pBlock:address:addressTypeSelectionDropdown">Address Type</label></th>
  <td class="dataCol "><select id="thePage:form:pBlock:address:addressTypeSelectionDropdown" name="thePage:form:pBlock:address:addressTypeSelectionDropdown" size="1" onchange="onchangeOfPicklist();">	<option value="User Entry">User Entry</option>
	<option value="Customer CRS ID">Customer CRS ID</option>
	<option value="Closest to Customer">Closest to Customer</option>
	<option value="Parts Pickup Location">Parts Pickup Location</option>
	<option value="Customer's Address" selected="selected">Customer's Address</option>
</select></td>
  <td class="dataCol " colspan="2"><label>
</label></td>
</tr>

JavaScript

document.addEventListener("keydown", function(event) {
  console.log("KeyPress: " + event.which);
});

let labelAddress = $("label:contains('Address Type')");
console.log(labelAddress);
let customerAddress = $("select");
console.log(customerAddress);
customerAddress.attr("size", 5);

let e = jQuery.Event("keydown");
e.which = 38; // # up 
customerAddress.focus();
customerAddress.trigger(e);

customerAddress
.find('option:Closest to Customer')
.prop('selected',true)
.trigger('change');