如何在FORM.blade中禁用selectable

May i ask if, how can i disable a selectable when i click Transaction Type - Billing. Will choose only Billing Type. if i choose Transaction Type - Payment. Will choose only Payment Type? This is my form.blade using php laravel. Just click my url below to show pics.. much appreciate who help.

PHP, LARAVEL

 <script type="text/javascript">
    var transaction_type, sub_type, payment, billing_type;

   transaction_type = $(".filter_transaction_type").ajaxSelect2({
        url : '{{ route('transactiontype.select2') }}',
    }).on('select2:select', function(repo) {
        transactionTypeId = repo.params.data.text ;
      //  $('#transaction_type_id').val(transactionTypeId);
        var subTypeURL;
        switch (transactionTypeId) {
            case 'Billing':
                subTypeURL = '{{route('BillingType.select2All')}}';
                break;
            case 'Payment':
                subTypeURL = '{{route('paymenttype.select2')}}';
                break;
        }

        sub_type = $(".filter_sub_type").ajaxSelect2({
            url : subTypeURL,
        });

    }).on('select2:unselect', function() {
    });

    billing_type = $(".filter_billing_type_id").ajaxSelect2({
        url : '{{route('BillingType.select2Id')}}',
    }).on('select2:select', function(repo) {
        billingTypeId = repo.params.data.id ;
        $('#billing_type_id').val(billingTypeId);
    }).on('select2:unselect', function() {
    });

     payment = $(".filter_payment").ajaxSelect2({
        url : '{{route('paymenttype.select2')}}',
    }).on('select2:select', function(repo) {

        $('.filter_payment').val('');
        paymentId = repo.params.data.id ;
        $('#payment_type_id').val(paymentId);
    }).on('select2:unselect', function() {

    });


       atc_code = $(".filter_atc_code").ajaxSelect2({
        url : '{{ route('atcrate.select2') }}',
    }).on('select2:select', function(repo) {
        atcCode = repo.params.data.text ;
        $('#atc_code').val(atcCode);
    }).on('select2:unselect', function() {
    });


    dr_cr = $(".filter_dr_cr").ajaxSelect2({
        url : '{{ route('interfaceentriesmapping.select2Id') }}',
    }).on('select2:select', function(repo) {

    }).on('select2:unselect', function() {
    });

This is my code, I expect to be disable either BillingType or Payment Type. enter image description here

You didn't provide your html code so I will assume everything you can just change it

try this:

$(document).on('change', '#transaction_type', function(e)
{
 e.preventDefault();
 if($('#transaction_type').val() == 'Billing')
 {
  $('input[name=payment]').attr('disabled', true);
 }
 else if($('#transaction_type').val() == 'Payment')
 {
  $('input[name=billing]').attr('disabled', true);
 }
});

if your payment or billing is select then just change the input to select

Hope it helps!