How to enable/disable a certain field(s) base on input from drop-down menu?

Dropdown Menu id = payment_method

• paid by reciever
• charge through invoices

Dropdown Menu id = shipping_carrier

• Fedex
• DHL

Input Field id = shipping_number __________________

Goal:

if user select charge through invoices

• disable shipping_carrier
• set Fedex as default
• hide() my shipping number input

Else,

• enable the shipping_carrier
• enable shipping number input (required)

Code

<script>
  var logistic = function () {
    if ($( "#payment_method option:selected" ).text("Charge through invoices")) {
        $('#shipping_carrier').prop('disabled', false);

    else {
        $('#shipping_carrier').prop('disabled', 'disabled');
    }
  };
  $(logistic);
  $("#paid_by_reciever").change(logistic);



</script>

Answer

Here you go:

$("#payment_method").change(function() {
  console.log($("#payment_method option:selected").val());
  if ($("#payment_method option:selected").val() == 2) {
    $('#shipping_carrier').prop('disabled', 'disabled');
    $('#shipping_carrier').val(1);
    $('#shipping_number').hide();
  } else {
    $('#shipping_carrier').prop('disabled', false);
    $('#shipping_number').show();
  }
});

label {
  display: block;
  margin-bottom: 10px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label>
	Payment method: <br />
	<select id="payment_method" name="payment_method">
		<option value="1">paid by reciever</option>
		<option value="2">charge through invoices</option>
	</select>
</label>

<label>
	Shipping Carrier
	<select id="shipping_carrier" name="shipping_carrier">
		<option value="1">Fedex</option>
		<option value="2">DHL</option>
	</select><br />

</label>

<label>
	Shipping number<br />
 	<input type="text" name="shipping_number" id="shipping_number" value="" />
</label>